.home-starter{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:18px;
  align-items:stretch;
  margin-bottom:24px;
}
.home-starter-copy,
.home-starter-proof,
.home-focus,
.home-projects,
.home-process,
.home-community{
  border:2px solid var(--line);
  border-radius:16px;
  background:var(--panel);
}
.home-starter-copy{
  padding:24px;
}
.home-starter-copy h1{
  margin:8px 0 10px;
  max-width:820px;
  font-size:clamp(2.2rem,4.6vw,4.5rem);
  line-height:.96;
  letter-spacing:-.055em;
}
.home-starter-copy>p{
  margin:0;
  max-width:720px;
  color:var(--muted);
  line-height:1.55;
}
.home-starter-actions{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  align-items:center;
  margin-top:18px;
}
.home-text-action{
  border:0;
  background:transparent;
  padding:8px 2px;
  color:var(--muted);
  cursor:pointer;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.home-starter-status{
  margin-top:12px!important;
  font-size:.74rem;
}
.home-starter-proof{
  display:grid;
  align-content:center;
  padding:14px;
  background:var(--yellow);
  color:#171319;
}
.home-starter-proof>div{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:9px;
  align-items:center;
  padding:12px 4px;
  border-bottom:1px solid #17131955;
}
.home-starter-proof>div:last-child{border-bottom:0}
.home-starter-proof span{
  grid-row:1/3;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:2px solid #171319;
  border-radius:50%;
  font:700 .7rem 'DM Mono',monospace;
}
.home-starter-proof b,
.home-starter-proof small{display:block}
.home-starter-proof b{font-size:.9rem}
.home-starter-proof small{
  margin-top:2px;
  font-size:.68rem;
  color:#3d3320;
}

.home-focus,
.home-projects{
  margin-bottom:18px;
  padding:18px;
}
.home-section-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:end;
  margin-bottom:14px;
}
.home-section-head h2{
  margin:4px 0 0;
  font-size:1.45rem;
  line-height:1.1;
}
.home-section-head>p{
  margin:0;
  max-width:420px;
  color:var(--muted);
  font-size:.76rem;
  line-height:1.45;
  text-align:right;
}

.home-action-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.home-action-card{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 24px;
  gap:10px;
  align-items:center;
  min-height:88px;
  padding:13px;
  border:1.5px solid var(--line);
  border-radius:12px;
  background:var(--paper);
  color:var(--ink);
  text-align:left;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.home-action-card:hover{
  transform:translateY(-2px);
  box-shadow:3px 3px 0 var(--line);
  background:var(--cream);
}
.home-action-card>span{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border:1.5px solid var(--line);
  border-radius:50%;
  background:var(--panel);
  font:700 .62rem 'DM Mono',monospace;
}
.home-action-card div{
  min-width:0;
}
.home-action-card b,
.home-action-card small{display:block}
.home-action-card b{
  font-size:.8rem;
}
.home-action-card small{
  margin-top:3px;
  color:var(--muted);
  font-size:.66rem;
  line-height:1.35;
}
.home-action-card i{
  font-style:normal;
  color:var(--muted);
  text-align:right;
}
.home-action-build{
  background:var(--coral);
  color:#fff;
}
.home-action-build>span{
  background:#fff3;
  border-color:#fff;
}
.home-action-build small,
.home-action-build i{
  color:#fff;
}

.home-projects .project-list{
  padding:2px 2px 5px;
}
.home-projects .empty-project,
.home-projects .project-card{
  min-width:230px;
  height:96px;
  box-shadow:none;
}
.home-projects .project-card:hover,
.home-projects .empty-project:hover{
  box-shadow:3px 3px 0 var(--line);
}

.home-lower{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(240px,.55fr);
  gap:14px;
  align-items:start;
}
.home-process{
  padding:0 15px 14px;
}
.home-process>summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-top:14px;
  cursor:pointer;
  list-style:none;
}
.home-process>summary::-webkit-details-marker{display:none}
.home-process>summary>span:first-child{
  display:grid;
  gap:3px;
}
.home-process>summary b{
  font-size:.85rem;
}
.home-process>summary>span:last-child{
  font-size:.7rem;
  font-weight:700;
}
.home-process .journey-nav{
  margin:14px 0 0;
  box-shadow:none;
}
.home-community{
  padding:15px;
}
.home-community>p{
  margin:6px 0 4px;
  font-weight:700;
  line-height:1.35;
}
.home-community>small{
  display:block;
  color:var(--muted);
  font-size:.66rem;
  line-height:1.4;
}

/* Returning learners get progress first; the beginner intro gets out of the way. */
.fc-returning-progress #view-home .home-starter{
  display:none;
}
.fc-returning-progress #view-home .home-focus{
  margin-top:2px;
}

/* Dark mode contrast for intentionally bright starter/action surfaces. */
.dark .home-starter-proof{
  color:#171319;
  border-color:#171319;
}
.dark .home-starter-proof *{
  color:#171319;
}
.dark .home-action-build{
  color:#fff;
}
.dark .home-action-build *{
  color:#fff;
}
.dark .home-action-card:not(.home-action-build){
  background:var(--panel);
}
.dark .home-action-card:not(.home-action-build):hover{
  background:var(--cream);
}

@media(max-width:1000px){
  .home-starter{
    grid-template-columns:1fr;
  }
  .home-starter-proof{
    grid-template-columns:repeat(3,1fr);
  }
  .home-starter-proof>div{
    grid-template-columns:36px 1fr;
    border-bottom:0;
    border-right:1px solid #17131955;
  }
  .home-starter-proof>div:last-child{border-right:0}
  .home-action-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .home-lower{
    grid-template-columns:1fr;
  }
}

@media(max-width:700px){
  .home-starter{
    margin-bottom:16px;
  }
  .home-starter-copy{
    padding:18px;
  }
  .home-starter-copy h1{
    font-size:2.35rem;
  }
  .home-starter-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .home-starter-actions .primary,
  .home-starter-actions .secondary,
  .home-text-action{
    width:100%;
    text-align:center;
  }
  .home-starter-proof{
    display:grid;
    grid-template-columns:1fr;
  }
  .home-starter-proof>div{
    border-right:0;
    border-bottom:1px solid #17131955;
  }
  .home-starter-proof>div:last-child{border-bottom:0}
  .home-section-head{
    display:grid;
    gap:5px;
  }
  .home-section-head>p{
    text-align:left;
  }
  .home-action-grid{
    grid-template-columns:1fr;
  }
  .home-focus,
  .home-projects{
    padding:14px;
  }
  .home-action-card{
    min-height:78px;
  }
  .home-process .journey-nav{
    grid-template-columns:repeat(7,auto);
  }
}


/* First Comet homepage color rhythm */
.home-starter-copy{border-top:5px solid var(--blue)}
.home-focus{border-top:5px solid var(--coral)}
.home-projects{border-top:5px solid var(--blue)}
.home-process{border-top:5px solid var(--yellow)}
.home-community{border-top:5px solid var(--pink)}

.home-action-card:nth-child(1){
  background:var(--coral);
  color:#fff;
}
.home-action-card:nth-child(2){
  background:var(--blue);
  color:#fff;
}
.home-action-card:nth-child(3){
  background:var(--yellow-soft);
}
.home-action-card:nth-child(4){
  background:var(--pink-soft);
}
.home-action-card:nth-child(5){
  background:var(--green-soft);
}
.home-action-card:nth-child(6){
  background:var(--red-soft);
}
.home-action-card:nth-child(1) small,
.home-action-card:nth-child(1) i,
.home-action-card:nth-child(2) small,
.home-action-card:nth-child(2) i{
  color:#fff;
}
.home-action-card:nth-child(1)>span,
.home-action-card:nth-child(2)>span{
  border-color:#fff;
  background:#ffffff20;
  color:#fff;
}
.home-action-card:nth-child(3)>span{background:var(--yellow)}
.home-action-card:nth-child(4)>span{background:var(--pink)}
.home-action-card:nth-child(5)>span{background:var(--green)}
.home-action-card:nth-child(6)>span{background:var(--coral);color:#fff}

.home-projects .project-card:nth-child(4n+1){border-top:4px solid var(--blue)}
.home-projects .project-card:nth-child(4n+2){border-top:4px solid var(--coral)}
.home-projects .project-card:nth-child(4n+3){border-top:4px solid var(--yellow)}
.home-projects .project-card:nth-child(4n){border-top:4px solid var(--green)}

.home-process .journey-nav button:nth-of-type(1) span{background:var(--coral)}
.home-process .journey-nav button:nth-of-type(2) span{background:var(--blue)}
.home-process .journey-nav button:nth-of-type(3) span{background:var(--green)}
.home-process .journey-nav button:nth-of-type(4) span{background:var(--pink)}

.dark .home-action-card:nth-child(1),
.dark .home-action-card:nth-child(2){
  color:#fff;
}
.dark .home-action-card:nth-child(3),
.dark .home-action-card:nth-child(4),
.dark .home-action-card:nth-child(5),
.dark .home-action-card:nth-child(6){
  color:var(--ink);
}
.dark .home-action-card:nth-child(3) small,
.dark .home-action-card:nth-child(4) small,
.dark .home-action-card:nth-child(5) small,
.dark .home-action-card:nth-child(6) small{
  color:var(--muted);
}


/* Explicit contrast for saturated homepage badges */
.home-action-card:nth-child(3)>span,
.home-action-card:nth-child(4)>span{color:#171319}
.home-action-card:nth-child(5)>span,
.home-action-card:nth-child(6)>span{color:#fff}
.dark .home-action-card:nth-child(3)>span,
.dark .home-action-card:nth-child(4)>span{color:#171319}
.dark .home-action-card:nth-child(5)>span,
.dark .home-action-card:nth-child(6)>span{color:#fff}


/* Calm homepage v2: fewer visible choices, more progressive disclosure */
.home-starter{
  display:block;
  max-width:920px;
  margin:0 auto 22px;
}
.home-starter-copy{
  padding:34px 32px;
  border-top:5px solid var(--blue);
}
.home-starter-copy h1{
  max-width:720px;
}
.home-starter-actions{
  margin-top:20px;
}
.home-focus{
  max-width:1040px;
  margin:0 auto 16px;
  padding:16px;
  border-top:0;
}
.home-action-grid-core{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.home-action-grid-core .home-action-card{
  min-height:92px;
}
.home-action-grid-core .home-action-card:nth-child(1){
  background:var(--blue-soft);
  color:var(--ink);
  border-top:4px solid var(--blue);
}
.home-action-grid-core .home-action-card:nth-child(1)>span{
  background:var(--blue);
  color:#fff;
  border-color:var(--line);
}
.home-action-grid-core .home-action-card:nth-child(1) small,
.home-action-grid-core .home-action-card:nth-child(1) i{
  color:var(--muted);
}
.home-action-grid-core .home-action-card:nth-child(2){
  background:var(--red-soft);
  color:var(--ink);
  border-top:4px solid var(--coral);
}
.home-action-grid-core .home-action-card:nth-child(2)>span{
  background:var(--coral);
  color:#fff;
  border-color:var(--line);
}
.home-action-grid-core .home-action-card:nth-child(2) small,
.home-action-grid-core .home-action-card:nth-child(2) i{
  color:var(--muted);
}
.home-action-grid-core .home-action-card:nth-child(3){
  background:var(--pink-soft);
  color:var(--ink);
  border-top:4px solid var(--pink);
}
.home-action-grid-core .home-action-card:nth-child(3)>span{
  background:var(--pink);
  color:#171319;
}
.home-action-grid-core .home-action-card:nth-child(3) small,
.home-action-grid-core .home-action-card:nth-child(3) i{
  color:var(--muted);
}

.home-compact-details{
  max-width:1040px;
  margin:10px auto 0;
  padding:0 15px 13px;
  border:1.5px solid var(--line);
  border-radius:13px;
  background:var(--panel);
}
.home-compact-details>summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 0 0;
  cursor:pointer;
  list-style:none;
}
.home-compact-details>summary::-webkit-details-marker{display:none}
.home-compact-details>summary>span:first-child{
  display:grid;
  gap:2px;
}
.home-compact-details>summary>span:last-child{
  font-size:.68rem;
  font-weight:700;
  color:var(--muted);
}
.home-compact-details .project-list{
  margin-top:12px;
  padding:2px 0 4px;
}
.home-more-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}
.home-more-grid button{
  display:grid;
  gap:4px;
  min-height:72px;
  padding:11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--paper);
  color:var(--ink);
  text-align:left;
  cursor:pointer;
}
.home-more-grid button:nth-child(1){border-top:3px solid var(--coral)}
.home-more-grid button:nth-child(2){border-top:3px solid var(--green)}
.home-more-grid button:nth-child(3){border-top:3px solid var(--yellow)}
.home-more-grid button:nth-child(4){border-top:3px solid var(--blue)}
.home-more-grid b{font-size:.72rem}
.home-more-grid small{
  color:var(--muted);
  font-size:.63rem;
  line-height:1.35;
}

.home-quiet-footer{
  max-width:1040px;
  margin:14px auto 0;
  padding:8px 2px;
  border-top:1px solid color-mix(in srgb,var(--line) 28%,transparent);
}
.home-quiet-footer p{
  margin:0;
  color:var(--muted);
  font-size:.66rem;
}

/* Returning learners already have a next action in the progress card. */
.fc-returning-progress #view-home .home-starter,
.fc-returning-progress #view-home .home-focus{
  display:none;
}
.fc-returning-progress #view-home .home-projects{
  margin-top:10px;
}

/* Neutralize old six-card color rules on the new three-card grid */
.dark .home-action-grid-core .home-action-card:nth-child(1),
.dark .home-action-grid-core .home-action-card:nth-child(2),
.dark .home-action-grid-core .home-action-card:nth-child(3){
  color:var(--ink);
}
.dark .home-action-grid-core .home-action-card:nth-child(1) small,
.dark .home-action-grid-core .home-action-card:nth-child(2) small,
.dark .home-action-grid-core .home-action-card:nth-child(3) small{
  color:var(--muted);
}

@media(max-width:850px){
  .home-action-grid-core{
    grid-template-columns:1fr;
  }
  .home-more-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:560px){
  .home-starter-copy{
    padding:22px 18px;
  }
  .home-starter-copy h1{
    font-size:2.2rem;
  }
  .home-focus{
    padding:12px;
  }
  .home-more-grid{
    grid-template-columns:1fr;
  }
}


/* Visual interest without extra homepage content */
.home-starter-copy{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--yellow) 28%,transparent) 0 5px,transparent 6px),
    radial-gradient(circle at 82% 28%,color-mix(in srgb,var(--blue) 22%,transparent) 0 3px,transparent 4px),
    linear-gradient(128deg,var(--panel) 0 70%,var(--blue-soft) 100%);
  box-shadow:0 14px 38px color-mix(in srgb,var(--ink) 10%,transparent);
}
.home-starter-copy:before{
  content:"";
  position:absolute;
  z-index:-1;
  width:240px;
  height:100px;
  right:-38px;
  top:28px;
  border:2px dashed color-mix(in srgb,var(--blue) 36%,transparent);
  border-radius:50%;
  transform:rotate(-18deg);
}
.home-starter-copy:after{
  content:"";
  position:absolute;
  right:24px;
  bottom:20px;
  color:var(--coral);
  font-size:1.05rem;
  opacity:.7;
}
.home-focus,
.home-compact-details{
  box-shadow:0 9px 24px color-mix(in srgb,var(--ink) 6%,transparent);
}

/* 02 · The three choices become recognizable objects */
.home-action-grid-core .home-action-card{
  grid-template-columns:64px minmax(0,1fr) 22px;
  min-height:112px;
  overflow:hidden;
  position:relative;
  box-shadow:0 7px 18px color-mix(in srgb,var(--ink) 7%,transparent);
}
.home-action-grid-core .home-action-card:after{
  content:"";
  position:absolute;
  inset:auto -18px -26px auto;
  width:72px;
  height:72px;
  border-radius:50%;
  background:color-mix(in srgb,currentColor 8%,transparent);
  pointer-events:none;
}
.home-action-grid-core .home-action-card:hover{
  transform:translateY(-4px);
  box-shadow:5px 6px 0 var(--line),0 14px 28px color-mix(in srgb,var(--ink) 10%,transparent);
}
.home-action-card>em{
  font-style:normal;
  color:var(--muted);
  font-size:1.05rem;
  transition:transform .18s ease;
}
.home-action-card:hover>em{transform:translateX(3px)}

.home-action-grid-core .home-card-object{
  position:relative;
  display:block;
  width:56px;
  height:56px;
  min-width:56px;
  border:2px solid var(--line);
  border-radius:13px;
  box-shadow:3px 3px 0 color-mix(in srgb,var(--line) 88%,transparent);
  transition:transform .22s ease;
}
.home-action-card:hover .home-card-object{
  transform:translateY(-3px) rotate(-2deg);
}

/* blue code window */
.home-card-object.code-window{
  background:#1d1a20!important;
  border-color:var(--line)!important;
  color:#fff!important;
}
.code-window:before{
  content:"";
  position:absolute;
  left:7px;
  top:7px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--coral);
  box-shadow:9px 0 0 var(--yellow),18px 0 0 var(--green);
}
.code-window:after{
  content:"</>";
  position:absolute;
  inset:20px 0 auto;
  text-align:center;
  color:color-mix(in srgb,var(--blue) 55%,white);
  font:700 .75rem 'DM Mono',monospace;
}
.code-window i{
  position:absolute;
  display:block;
  height:2px;
  border-radius:4px;
  background:#ffffff55;
}
.code-window i:nth-child(1){left:8px;right:8px;bottom:8px}
.code-window i:nth-child(2){left:8px;width:20px;bottom:14px}
.code-window i:nth-child(3){display:none}

/* coral folder */
.home-card-object.project-folder{
  margin-top:5px;
  height:46px;
  border-radius:7px 10px 10px 10px;
  background:var(--coral)!important;
  color:#fff!important;
}
.project-folder:before{
  content:"";
  position:absolute;
  left:-2px;
  top:-12px;
  width:26px;
  height:13px;
  border:2px solid var(--line);
  border-bottom:0;
  border-radius:7px 7px 0 0;
  background:var(--coral);
}
.project-folder:after{
  content:"";
  position:absolute;
  left:9px;
  right:9px;
  top:13px;
  height:13px;
  border:2px solid #fff;
  border-radius:3px;
  opacity:.8;
}
.project-folder i{
  position:absolute;
  width:13px;
  height:13px;
  right:-6px;
  bottom:-7px;
  border:2px solid var(--line);
  border-radius:50%;
  background:var(--yellow);
  box-shadow:none;
}

/* pink compass/orbit */
.home-card-object.direction-compass{
  border-radius:50%;
  background:var(--pink)!important;
  color:#171319!important;
}
.direction-compass:before,
.direction-compass:after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) rotate(45deg);
}
.direction-compass:before{
  width:26px;
  height:26px;
  border:2px solid #171319;
  border-radius:50%;
}
.direction-compass:after{
  width:4px;
  height:34px;
  background:linear-gradient(to bottom,var(--blue) 0 50%,#171319 50% 100%);
  clip-path:polygon(50% 0,100% 45%,65% 45%,65% 100%,35% 100%,35% 45%,0 45%);
}
.direction-compass i{
  position:absolute;
  width:7px;
  height:7px;
  right:3px;
  top:7px;
  border:1.5px solid #171319;
  border-radius:50%;
  background:var(--yellow);
}

/* 04 · Compact Comet Trail */
.home-comet-trail{
  position:relative;
  max-width:610px;
  margin-top:22px;
  padding:12px 8px 0;
}
.trail-line{
  position:relative;
  height:3px;
  margin:0 10px;
  background:color-mix(in srgb,var(--line) 20%,transparent);
  border-radius:999px;
}
.trail-line i{
  display:block;
  width:var(--trail-progress,8%);
  height:100%;
  background:linear-gradient(90deg,var(--coral),var(--yellow),var(--blue));
  border-radius:inherit;
  transition:width .55s ease;
}
.trail-comet{
  position:absolute;
  z-index:2;
  left:calc(var(--trail-progress,8%) - 3px);
  top:1px;
  transform:translateX(-50%);
  font-size:1.05rem;
  color:var(--coral);
  filter:drop-shadow(2px 2px 0 color-mix(in srgb,var(--line) 26%,transparent));
}
.home-comet-trail:has(.trail-line i[style*="8%"]) .trail-comet{left:8%}
.trail-stops{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:7px;
}
.trail-stops span{
  position:relative;
  padding-top:9px;
  color:var(--muted);
  font-size:.62rem;
  text-align:center;
}
.trail-stops span:before{
  content:"";
  position:absolute;
  top:-12px;
  left:50%;
  width:8px;
  height:8px;
  transform:translateX(-50%);
  border:2px solid var(--line);
  border-radius:50%;
  background:var(--panel);
}
.trail-stops span.active{
  color:var(--ink);
}
.trail-stops span.active:before{
  background:var(--yellow);
}
.trail-stops b{font-weight:700}

/* 06 · Layered surface depth */
.home-compact-details[open]{
  box-shadow:4px 5px 0 color-mix(in srgb,var(--line) 85%,transparent),0 12px 28px color-mix(in srgb,var(--ink) 8%,transparent);
}
.home-compact-details>summary{
  transition:padding-left .18s ease;
}
.home-compact-details>summary:hover{
  padding-left:4px;
}
.home-more-grid button,
.home-projects .project-card,
.home-projects .empty-project{
  transition:transform .18s ease,box-shadow .18s ease;
}
.home-more-grid button:hover,
.home-projects .project-card:hover,
.home-projects .empty-project:hover{
  transform:translateY(-2px);
  box-shadow:3px 3px 0 var(--line);
}

.dark .home-starter-copy{
  background:
    radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--yellow) 20%,transparent) 0 5px,transparent 6px),
    radial-gradient(circle at 82% 28%,color-mix(in srgb,var(--blue) 18%,transparent) 0 3px,transparent 4px),
    linear-gradient(128deg,var(--panel) 0 72%,var(--blue-soft) 100%);
}
.dark .home-action-grid-core .home-card-object.project-folder{
  color:#fff!important;
}
.dark .home-action-grid-core .direction-compass{
  color:#171319!important;
}

@media(max-width:700px){
  .home-comet-trail{max-width:none}
  .home-action-grid-core .home-action-card{
    grid-template-columns:58px minmax(0,1fr) 20px;
  }
  .home-action-grid-core .home-card-object{
    width:50px;
    height:50px;
    min-width:50px;
  }
  .home-card-object.project-folder{height:42px}
}
@media(prefers-reduced-motion:reduce){
  .home-action-card,
  .home-card-object,
  .home-action-card>em,
  .trail-line i,
  .home-compact-details>summary{
    transition:none!important;
  }
}


/* First Comet Mission Control: bold visual identity without extra content */
.home-starter{
  max-width:1100px;
}
.home-starter-copy{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr);
  gap:0;
  min-height:430px;
  padding:0;
  overflow:hidden;
  border:2px solid var(--line);
  border-top:0;
  border-radius:22px;
  background:var(--panel);
  box-shadow:8px 9px 0 color-mix(in srgb,var(--line) 90%,transparent),0 24px 60px color-mix(in srgb,var(--ink) 12%,transparent);
}
.home-starter-copy:before,
.home-starter-copy:after{
  display:none;
}
.home-hero-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:42px 38px 34px;
  border-top:7px solid var(--blue);
  background:
    radial-gradient(circle at 8% 10%,color-mix(in srgb,var(--yellow) 24%,transparent) 0 4px,transparent 5px),
    linear-gradient(135deg,var(--panel),color-mix(in srgb,var(--blue-soft) 42%,var(--panel)));
}
.home-mission-tag{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  margin-bottom:12px;
  color:var(--blue-deep);
  font:800 .67rem 'DM Mono',monospace;
  letter-spacing:.13em;
}
.home-mission-tag:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--coral);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--coral) 14%,transparent);
}
.home-hero-copy h1{
  margin:0 0 13px;
  max-width:620px;
  font-size:clamp(2.4rem,4.5vw,4.3rem);
  line-height:.94;
  letter-spacing:-.055em;
}
.home-hero-copy>p{
  max-width:620px;
}
.home-starter-actions{
  margin-top:22px;
}
.home-starter-actions .primary{
  min-height:46px;
  padding-inline:18px;
  box-shadow:4px 4px 0 var(--line);
}
.home-starter-actions .primary:hover{
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 var(--line);
}
.home-starter-actions .secondary{
  min-height:46px;
  background:var(--blue-soft);
  border-color:var(--blue);
}
.home-starter-status{
  margin-top:15px!important;
}

/* Signature visual: a tiny mission-control universe */
.home-hero-scene{
  position:relative;
  min-height:430px;
  overflow:hidden;
  border-left:2px solid var(--line);
  background:
    radial-gradient(circle at 70% 24%,#ffffff 0 1px,transparent 2px),
    radial-gradient(circle at 34% 63%,#ffffffcc 0 1px,transparent 2px),
    radial-gradient(circle at 84% 71%,#ffffffaa 0 1px,transparent 2px),
    radial-gradient(circle at 23% 19%,#ffffff99 0 1px,transparent 2px),
    radial-gradient(circle at 56% 86%,#ffffff88 0 1px,transparent 2px),
    linear-gradient(145deg,color-mix(in srgb,var(--blue) 18%,#171319) 0%,color-mix(in srgb,var(--blue) 58%,#171319) 55%,color-mix(in srgb,var(--coral) 14%,#171319) 100%);
}
.scene-grid{
  position:absolute;
  inset:0;
  opacity:.16;
  background-image:
    linear-gradient(#ffffff 1px,transparent 1px),
    linear-gradient(90deg,#ffffff 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom,#000,transparent 86%);
}
.scene-orbit{
  position:absolute;
  border:2px solid #ffffff38;
  border-radius:50%;
}
.scene-orbit-a{
  width:330px;
  height:138px;
  left:30px;
  top:118px;
  transform:rotate(-18deg);
}
.scene-orbit-b{
  width:250px;
  height:250px;
  right:-34px;
  top:54px;
  border-style:dashed;
  border-color:color-mix(in srgb,var(--blue) 42%,transparent);
}
.scene-planet{
  position:absolute;
  display:block;
  border:2px solid #0b1020;
  border-radius:50%;
  box-shadow:4px 5px 0 #0b1020;
}
.planet-blue{
  width:72px;
  height:72px;
  left:56px;
  top:72px;
  background:
    radial-gradient(circle at 32% 26%,#ffffff66 0 7px,transparent 8px),
    linear-gradient(145deg,color-mix(in srgb,var(--blue) 58%,white),var(--blue));
}
.planet-coral{
  width:46px;
  height:46px;
  right:58px;
  bottom:68px;
  background:
    radial-gradient(circle at 35% 28%,#ffffff77 0 5px,transparent 6px),
    linear-gradient(145deg,#ff9a84,var(--coral));
}
.scene-comet{
  position:absolute;
  z-index:3;
  left:46%;
  top:43%;
  font-size:2.15rem;
  color:var(--yellow);
  filter:drop-shadow(5px 5px 0 #0b1020);
  animation:fcHeroComet 5.8s ease-in-out infinite;
}
.scene-comet:after{
  content:"";
  position:absolute;
  width:70px;
  height:10px;
  right:22px;
  top:19px;
  border-radius:999px;
  transform:rotate(-18deg);
  background:linear-gradient(90deg,transparent,#ff593788,#ffd33dcc);
  z-index:-1;
}
.scene-star{
  position:absolute;
  color:var(--yellow);
  text-shadow:3px 3px 0 #0b1020;
}
.star-a{
  right:42px;
  top:42px;
  font-size:1.5rem;
  animation:fcTwinkle 2.8s ease-in-out infinite;
}
.star-b{
  left:38px;
  bottom:48px;
  color:var(--pink);
  font-size:1.05rem;
  animation:fcTwinkle 2.8s ease-in-out 1.2s infinite;
}
.scene-chip{
  position:absolute;
  z-index:4;
  display:grid;
  gap:2px;
  min-width:72px;
  padding:8px 10px;
  border:2px solid #0b1020;
  border-radius:11px;
  box-shadow:4px 4px 0 #0b1020;
  color:#171319;
}
.scene-chip b{
  font:800 .82rem 'DM Mono',monospace;
}
.scene-chip small{
  font:700 .58rem 'DM Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.scene-code{
  right:26px;
  top:118px;
  background:color-mix(in srgb,var(--blue) 48%,white);
  animation:fcFloatA 4.6s ease-in-out infinite;
}
.scene-build{
  left:36px;
  bottom:104px;
  background:#ff8d74;
  animation:fcFloatB 5.2s ease-in-out .5s infinite;
}
.scene-ship{
  right:82px;
  bottom:26px;
  background:var(--yellow);
  animation:fcFloatA 4.8s ease-in-out 1s infinite;
}
.scene-status{
  position:absolute;
  left:20px;
  top:18px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  border:1px solid #ffffff38;
  border-radius:999px;
  background:#0b102088;
  color:#fff;
  backdrop-filter:blur(6px);
  font:700 .58rem 'DM Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.scene-status span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#8bd17c;
  box-shadow:0 0 0 4px #8bd17c1f;
}

/* The trail feels embedded in the mission, not like another card */
.home-hero-copy .home-comet-trail{
  margin-top:auto;
  padding-top:24px;
}
.home-hero-copy .trail-line{
  background:color-mix(in srgb,var(--blue) 18%,var(--line));
}
.home-hero-copy .trail-stops span:before{
  box-shadow:0 0 0 3px var(--panel);
}

/* Poster-style core actions */
.home-focus{
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.home-section-head{
  padding:10px 2px 0;
}
.home-section-head h2{
  font-size:1.25rem;
}
.home-action-grid-core{
  gap:14px;
}
.home-action-grid-core .home-action-card{
  display:block;
  position:relative;
  min-height:172px;
  padding:18px;
  overflow:hidden;
  border:2px solid var(--line);
  border-radius:18px;
  text-align:left;
  box-shadow:5px 6px 0 color-mix(in srgb,var(--line) 88%,transparent);
}
.home-action-grid-core .home-action-card:before{
  content:"";
  position:absolute;
  inset:auto -26px -38px auto;
  width:118px;
  height:118px;
  border:2px solid currentColor;
  border-radius:50%;
  opacity:.08;
}
.home-action-grid-core .home-action-card:nth-child(1){
  background:
    radial-gradient(circle at 18% 20%,#ffffffaa 0 2px,transparent 3px),
    linear-gradient(145deg,color-mix(in srgb,var(--blue) 20%,white),var(--blue-soft));
  border-top:2px solid var(--line);
}
.home-action-grid-core .home-action-card:nth-child(2){
  background:
    radial-gradient(circle at 82% 18%,#ffffff99 0 2px,transparent 3px),
    linear-gradient(145deg,#ffd4c9,var(--red-soft));
  border-top:2px solid var(--line);
}
.home-action-grid-core .home-action-card:nth-child(3){
  background:
    radial-gradient(circle at 18% 76%,#ffffff99 0 2px,transparent 3px),
    linear-gradient(145deg,#f6d3ec,var(--pink-soft));
  border-top:2px solid var(--line);
}
.home-action-grid-core .home-card-object{
  position:absolute;
  top:17px;
  right:18px;
  width:64px;
  height:64px;
  min-width:64px;
  box-shadow:4px 4px 0 var(--line);
}
.home-action-grid-core .project-folder{
  height:52px;
  top:26px;
}
.home-action-grid-core .home-action-card>div{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  padding-right:34px;
}
.home-action-grid-core .home-action-card b{
  font-size:1.02rem;
}
.home-action-grid-core .home-action-card small{
  max-width:210px;
  margin-top:5px;
  font-size:.71rem;
}
.home-action-grid-core .home-action-card>em{
  position:absolute;
  right:18px;
  bottom:18px;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:1.5px solid var(--line);
  border-radius:50%;
  background:#ffffff99;
  color:var(--ink);
}
.home-action-grid-core .home-action-card:hover{
  transform:translate(-2px,-3px);
  box-shadow:8px 9px 0 var(--line);
}
.home-action-grid-core .home-action-card:hover .home-card-object{
  transform:translateY(-5px) scale(1.04);
}

/* More personality in the quieter sections */
.home-compact-details{
  position:relative;
  overflow:hidden;
  border-radius:15px;
}
.home-projects:before,
.home-more:before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:6px;
  height:100%;
}
.home-projects:before{background:var(--blue)}
.home-more:before{background:var(--coral)}
.home-quiet-footer{
  text-align:right;
}

/* Keyframes */
@keyframes fcHeroComet{
  0%,100%{transform:translate(-10px,7px) rotate(-8deg)}
  50%{transform:translate(24px,-18px) rotate(4deg)}
}
@keyframes fcTwinkle{
  0%,100%{opacity:.45;transform:scale(.82)}
  50%{opacity:1;transform:scale(1.18)}
}
@keyframes fcFloatA{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
@keyframes fcFloatB{
  0%,100%{transform:translateY(0) rotate(0)}
  50%{transform:translateY(7px) rotate(1deg)}
}

.dark .home-hero-copy{
  background:
    radial-gradient(circle at 8% 10%,#ffd33d22 0 4px,transparent 5px),
    linear-gradient(135deg,var(--panel),color-mix(in srgb,var(--blue) 28%,#171319));
}
.dark .home-mission-tag{color:color-mix(in srgb,var(--blue) 55%,white)}
.dark .home-starter-actions .secondary{
  color:var(--ink);
}
.dark .home-action-grid-core .home-action-card:nth-child(1){
  background:linear-gradient(145deg,color-mix(in srgb,var(--blue) 38%,#171319),color-mix(in srgb,var(--blue) 26%,#171319));
}
.dark .home-action-grid-core .home-action-card:nth-child(2){
  background:linear-gradient(145deg,#5a2b27,#4b2523);
}
.dark .home-action-grid-core .home-action-card:nth-child(3){
  background:linear-gradient(145deg,#58344f,#4b2d43);
}
.dark .home-action-grid-core .home-action-card:nth-child(1),
.dark .home-action-grid-core .home-action-card:nth-child(2),
.dark .home-action-grid-core .home-action-card:nth-child(3){
  color:var(--ink);
}

@media(max-width:900px){
  .home-starter-copy{
    grid-template-columns:1fr;
  }
  .home-hero-scene{
    min-height:260px;
    border-left:0;
    border-top:2px solid var(--line);
  }
  .scene-orbit-a{
    left:20%;
    top:72px;
  }
  .scene-code{right:12%;top:54px}
  .scene-build{left:12%;bottom:44px}
  .scene-ship{right:24%;bottom:22px}
}
@media(max-width:560px){
  .home-hero-copy{
    padding:26px 20px 22px;
  }
  .home-hero-copy h1{
    font-size:2.55rem;
  }
  .home-starter-actions{
    display:grid;
  }
  .home-hero-scene{
    min-height:220px;
  }
  .scene-orbit-a{
    width:250px;
    height:105px;
    left:10%;
  }
  .scene-orbit-b{
    width:180px;
    height:180px;
  }
  .planet-blue{
    width:54px;
    height:54px;
  }
  .scene-chip{
    transform:scale(.86);
  }
  .home-action-grid-core .home-action-card{
    min-height:150px;
  }
}
@media(prefers-reduced-motion:reduce){
  .scene-comet,
  .scene-star,
  .scene-chip{
    animation:none!important;
  }
}


/* Home layout alignment pass */
#view-home{
  width:100%;
  max-width:1280px;
  margin:0 auto;
}
#view-home .home-starter,
#view-home .home-focus,
#view-home .home-secondary-grid,
#view-home .home-quiet-footer{
  width:100%;
  max-width:none;
}
.home-secondary-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:14px;
}
.home-secondary-grid .home-compact-details{
  width:100%;
  max-width:none;
  margin:0;
}
.home-secondary-grid .home-projects,
.home-secondary-grid .home-more{
  min-height:64px;
}
.home-secondary-grid .home-projects[open],
.home-secondary-grid .home-more[open]{
  grid-column:span 1;
}
.home-secondary-grid .project-list{
  max-width:100%;
}
.home-secondary-grid .home-more-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

/* Visitor count belongs to the frame, not as a floating pill */
#view-home .home-quiet-footer{
  display:flex;
  justify-content:flex-end;
  margin-top:12px;
  padding-top:10px;
}
#view-home #fcVisitorStats{
  display:block;
  width:auto;
  max-width:none;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font:500 .64rem/1.4 "DM Mono",monospace;
  color:var(--muted);
}

/* Keep the command bar aligned with the home frame */
body:has(#view-home.active) .command-bar{
  left:calc(var(--rail) + (100vw - var(--rail))/2);
  width:min(860px,calc(100vw - var(--rail) - 64px));
}

/* Returning state uses the same lower rhythm */
.fc-returning-progress #view-home .home-secondary-grid{
  margin-top:14px;
}
@media(max-width:900px){
  #view-home{
    max-width:none;
  }
  .home-secondary-grid{
    grid-template-columns:1fr;
  }
  .home-secondary-grid .home-more-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:560px){
  .home-secondary-grid .home-more-grid{
    grid-template-columns:1fr;
  }
  #view-home .home-quiet-footer{
    justify-content:flex-start;
  }
}


/* Final desktop composition fixes from live screenshot */
body:has(#view-home.active) main{
  padding-left:32px;
  padding-right:32px;
  padding-top:30px;
}
.fc-returning-progress #view-home .home-secondary-grid .home-projects,
.fc-returning-progress #view-home .home-secondary-grid .home-more{
  margin:0;
}
.home-secondary-grid .home-compact-details[open]{
  grid-column:1/-1;
}
.home-secondary-grid .home-compact-details[open] .project-list{
  width:100%;
}
@media(max-width:700px){
  body:has(#view-home.active) main{
    padding-left:16px;
    padding-right:16px;
    padding-top:20px;
  }
}


/* Homepage typography scale: readable on desktop without feeling oversized */
#view-home .eyebrow,
.home-mission-tag{
  font-size:.78rem;
}
.home-hero-copy>p{
  font-size:1.05rem;
  line-height:1.6;
}
.home-starter-actions button{
  font-size:.92rem;
}
.home-starter-status{
  font-size:.82rem!important;
}
.trail-stops span{
  font-size:.74rem;
}
.home-section-head h2{
  font-size:1.55rem;
}
.home-action-grid-core .home-action-card b{
  font-size:1.12rem;
}
.home-action-grid-core .home-action-card small{
  font-size:.82rem;
  line-height:1.45;
}
.home-compact-details>summary b{
  font-size:.95rem;
}
.home-compact-details>summary .eyebrow{
  font-size:.68rem;
}
.home-compact-details>summary>span:last-child{
  font-size:.78rem;
}
.home-more-grid b{
  font-size:.84rem;
}
.home-more-grid small{
  font-size:.74rem;
}
#view-home #fcVisitorStats{
  font-size:.72rem;
}
.scene-chip small,
.scene-status{
  font-size:.66rem;
}
@media(max-width:700px){
  #view-home .eyebrow,
  .home-mission-tag{
    font-size:.7rem;
  }
  .home-hero-copy>p{
    font-size:.98rem;
  }
  .home-action-grid-core .home-action-card b{
    font-size:1.05rem;
  }
  .home-action-grid-core .home-action-card small{
    font-size:.78rem;
  }
}


/* Vintage flat-card treatment: no gradients on cards */
.home-starter-copy{
  background:var(--panel);
}
.home-hero-copy{
  background:var(--panel);
}
.home-action-grid-core .home-action-card:nth-child(1){
  background:var(--blue-soft);
}
.home-action-grid-core .home-action-card:nth-child(2){
  background:var(--red-soft);
}
.home-action-grid-core .home-action-card:nth-child(3){
  background:var(--pink-soft);
}
.home-action-grid-core .home-action-card{
  box-shadow:6px 7px 0 var(--line);
}
.home-action-grid-core .home-action-card:hover{
  box-shadow:9px 10px 0 var(--line);
}
.home-compact-details,
.home-more-grid button,
.home-projects .project-card,
.home-projects .empty-project{
  background:var(--panel);
}
.dark .home-hero-copy{
  background:var(--panel);
}
.dark .home-action-grid-core .home-action-card:nth-child(1){
  background:var(--blue-soft);
}
.dark .home-action-grid-core .home-action-card:nth-child(2){
  background:var(--red-soft);
}
.dark .home-action-grid-core .home-action-card:nth-child(3){
  background:var(--pink-soft);
}
