/* ---------- hero ---------- */
.hero{padding:88px 0 64px; position:relative}
.hero::before{
  content:""; position:absolute; z-index:-1;
  left:-28%; right:12%; top:-46%; height:640px;
  background:radial-gradient(closest-side, color-mix(in srgb,var(--accent) 15%, transparent), transparent 100%);
  pointer-events:none;
}
h1{margin:0 0 20px; font-size:clamp(34px,6vw,58px); line-height:1.24;
   letter-spacing:-.02em; font-weight:800}
h1 em{font-style:normal; color:var(--accent)}
.lede{margin:0 0 34px; max-width:38em; color:var(--fg-mut); font-size:clamp(15px,1.6vw,17px)}

/* ---------- notes band ---------- */
.band{
  background:var(--bg-elev); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:30px 32px;
  display:grid; grid-template-columns:1fr 1.1fr; gap:34px; align-items:center;
}
@media(max-width:800px){ .band{grid-template-columns:1fr; gap:24px; padding:26px} }
.band h3{margin:0 0 8px; font-size:19px; font-weight:750; letter-spacing:-.01em}
.band p{margin:0 0 20px; font-size:14.5px; color:var(--fg-mut)}
.latest{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.latest li{border-bottom:1px solid var(--line)}
.latest a{
  display:flex; align-items:baseline; gap:14px; padding:11px 4px;
  text-decoration:none; font-size:14px; transition:.16s;
}
.latest a:hover{color:var(--accent); padding-left:8px}
.latest .d{font-size:11.5px; color:var(--fg-dim); font-variant-numeric:tabular-nums; flex:none}
.latest .t{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.latest .empty{padding:14px 4px; font-size:13.5px; color:var(--fg-dim)}

/* ---------- repo list ---------- */
.repos{list-style:none; margin:0; padding:0;
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--bg-elev); overflow:hidden; box-shadow:var(--shadow)}
.repos li + li{border-top:1px solid var(--line)}
.repos a{
  display:grid; grid-template-columns:minmax(9.5em,auto) 1fr auto auto;
  align-items:center; gap:18px; padding:17px 22px;
  text-decoration:none; transition:background .16s ease;
}
.repos a:hover{background:var(--bg-sunk)}
.rn{font-size:14.5px; font-weight:650; font-family:var(--mono); letter-spacing:-.01em}
.rd{font-size:13.5px; color:var(--fg-mut)}
.rt{font-size:11.5px; color:var(--fg-dim); padding:3px 9px; border-radius:99px;
    border:1px solid var(--line); white-space:nowrap}
.rar{width:15px;height:15px;color:var(--fg-dim); flex:none}
.repos a:hover .rar{color:var(--accent)}
@media(max-width:700px){
  .repos a{grid-template-columns:1fr auto; gap:5px 14px; padding:16px 18px}
  .rd{grid-column:1/-1; order:3}
  .rt{order:2}
  .rar{display:none}
}

/* ---------- about ---------- */
.about{
  background:var(--bg-sunk); border:1px solid var(--line);
  border-radius:var(--radius); padding:34px;
  display:grid; grid-template-columns:1.4fr 1fr; gap:34px; align-items:start;
}
@media(max-width:760px){ .about{grid-template-columns:1fr; padding:26px} }
.about h2{margin:0 0 12px; font-size:19px; font-weight:750}
.about p{margin:0 0 12px; font-size:14.5px; color:var(--fg-mut)}
.facts{list-style:none; margin:0; padding:0; font-size:13.5px}
.facts li{display:flex; gap:14px; padding:9px 0; border-bottom:1px dashed var(--line)}
.facts li:last-child{border-bottom:0}
.facts .k{color:var(--fg-dim); flex:none; width:5.5em}
.facts .v{color:var(--fg)}