:root {
  color-scheme:dark;
  --cyan:#67e8f9;
  --muted:#b0b7c8;
  --dim:#707c93;
  --line:rgba(255,255,255,.08);
  --panel:rgba(255,255,255,.03);
  --gradient:linear-gradient(100deg,#19cee1,#9360fa)
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:0
}
body {
  margin:0;
  background:#050817;
  color:#f8fafc;
  font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.5
}
button,input,textarea {
  font:inherit
}
button,a,input,textarea {
  -webkit-tap-highlight-color:transparent
}
a {
  color:inherit;
  text-decoration:none
}
button {
  color:inherit;
  cursor:pointer
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible {
  outline:2px solid var(--cyan);
  outline-offset:5px
}
p,h1,h2,h3 {
  margin:0
}
p {
  color:var(--muted)
}
.icon {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex:none
}
.svg-defs {
  position:absolute;
  width:0;
  height:0;
  overflow:hidden
}
.skip-link {
  position:fixed;
  top:-60px;
  left:16px;
  background:var(--cyan);
  color:#050817;
  padding:10px 20px;
  z-index:100
}
.skip-link:focus {
  top:10px
}
.cosmos {
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:#050817
}
.cosmos canvas,.nebula,.constellations {
  position:absolute;
  inset:0;
  width:100%;
  height:100%
}
.nebula {
  background:radial-gradient(ellipse at 52% -5%,rgba(20,97,133,.27),transparent 62%),radial-gradient(ellipse at 12% 85%,rgba(0,72,75,.13),transparent 52%),radial-gradient(ellipse at 90% 98%,rgba(52,27,95,.12),transparent 52%)
}
.constellations {
  opacity:.08;
  fill:none;
  stroke:#536689;
  stroke-width:1
}
.cursor-glow {
  position:fixed;
  width:36px;
  height:36px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,rgba(56,189,248,.25),transparent 70%);
  transform:translate(-50%,-50%);
  z-index:80;
  opacity:0
}
.header {
  height:62px;
  position:fixed;
  inset:0 0 auto;
  z-index:30;
  transition:background .3s;
  backdrop-filter:blur(12px);
  background:rgba(5,11,27,.35)
}
.header.scrolled {
  background:rgba(5,11,27,.86);
  border-bottom:1px solid var(--line)
}
.nav-wrap {
  max-width:1100px;
  margin:auto;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.brand {
  display:flex;
  gap:10px;
  align-items:center;
  font:12px ui-monospace,monospace;
  letter-spacing:4px
}
.monogram {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:50%;
  letter-spacing:0;
  font-size:12px;
  color:#051322;
  background:linear-gradient(135deg,#0dd4ef,#9161ff);
  box-shadow:0 0 22px #22d3ee45
}
nav {
  display:flex;
  gap:4px
}
nav a {
  text-transform:uppercase;
  font-size:11px;
  letter-spacing:.6px;
  color:#9ca8be;
  padding:7px 12px;
  border-radius:20px;
  transition:.2s
}
nav a:hover,nav a.active {
  color:var(--cyan);
  background:rgba(34,211,238,.12)
}
.scroll-progress {
  height:1px;
  background:var(--gradient);
  width:0;
  position:absolute;
  bottom:0;
  box-shadow:0 0 6px #67e8f955
}
.menu-toggle {
  display:none
}
.hero {
  padding:96px 16px 64px;
  min-height:100svh;
  display:flex;
  align-items:center;
  position:relative
}
.hero-grid {
  max-width:1100px;
  width:100%;
  margin:auto;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:40px;
  align-items:center
}
.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:2px;
  color:var(--cyan);
  border:1px solid #67e8f933;
  background:#22d3ee12;
  border-radius:30px;
  padding:4px 12px;
  margin-bottom:24px
}
.eyebrow>span {
  width:6px;
  height:6px;
  background:#67e8f9;
  border-radius:50%
}
h1 {
  font-size:60px;
  font-weight:800;
  line-height:1;
  letter-spacing:-1.5px;
  margin-bottom:12px;
  white-space:nowrap
}
.subtitle {
  font-size:20px;
  line-height:28px;
  color:#a5e8f2;
  margin-bottom:16px
}
.bio {
  font-size:16px;
  line-height:24px;
  margin-bottom:24px
}
.hero-meta {
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  font-size:14px;
  color:#9ca8bd
}
.hero-meta>span,.hero-meta>a {
  display:flex;
  align-items:center;
  gap:6px
}
.hero-meta .icon {
  width:16px;
  height:16px;
  color:var(--cyan)
}
.hero-meta>a {
  color:var(--cyan)
}
.hero-actions {
  display:flex;
  gap:12px;
  margin-top:28px
}
.primary,.secondary {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:600;
  padding:11px 24px;
  border-radius:99px;
  transition:transform .2s,box-shadow .2s
}
.primary {
  color:#071529;
  background:var(--gradient);
  border:0;
  box-shadow:0 0 26px #22d3ee30
}
.primary:hover {
  transform:translateY(-2px);
  box-shadow:0 0 32px #22d3ee50
}
.secondary {
  border:1px solid #67e8f940
}
.secondary:hover {
  background:#67e8f90d;
  transform:translateY(-2px)
}
.stats {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:32px
}
.stats>div {
  padding:14px 8px 12px;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:12px;
  text-align:center;
  min-height:88px
}
.stats strong {
  display:block;
  color:var(--cyan);
  font-size:20px;
  line-height:28px;
  font-weight:800
}
.stats span {
  display:block;
  text-transform:uppercase;
  font-size:11px;
  line-height:17px;
  color:#9ca8bb
}
.solar-system {
  height:300px;
  display:grid;
  place-items:center
}
.orbit {
  width:300px;
  height:300px;
  border:1px solid #67e8f926;
  border-radius:50%;
  position:relative
}
.sun {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:20px;
  height:20px;
  background:radial-gradient(circle at 30% 25%,#ffef90,#fbbf24 45%,#e58b17);
  border-radius:50%;
  box-shadow:0 0 30px 10px #fbbf2430
}
.orbiter {
  position:absolute;
  inset:0;
  border-radius:50%;
  animation:orbit 60s linear infinite;
  pointer-events:none
}
.github-orbit {
  animation-delay:-20s
}
.planet-link {
  pointer-events:auto;
  position:absolute;
  top:calc(50% - 18px);
  right:-18px;
  width:36px;
  height:36px;
  display:flex;
  flex-direction:column;
  align-items:center;
  animation:counter-orbit 60s linear infinite
}
.github-orbit .planet-link {
  animation-delay:-20s
}
.planet {
  position:relative;
  display:block;
  flex:none;
  width:36px;
  height:36px;
  transition:transform .2s
}
.sphere {
  position:absolute;
  inset:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  z-index:2
}
.linkedin .sphere {
  background:radial-gradient(circle at 30% 25%,#4fa4ff,#1960df 52%,#183b9b);
  box-shadow:0 0 22px #2563eb80
}
.linkedin-mark {
  font:bold 17px Arial,sans-serif;
  color:white
}
.github .sphere {
  background:radial-gradient(circle at 30% 25%,#fff,#cbd5e1 65%,#77849a);
  box-shadow:0 0 24px #cbd5e160;
  color:#142136
}
.github .sphere .icon {
  width:22px;
  height:22px;
  stroke-width:1.5
}
.ring {
  position:absolute;
  left:-13px;
  top:10px;
  width:62px;
  height:17px;
  border:3px solid;
  border-radius:50%;
  transform:rotate(-24deg);
  box-shadow:inset 0 0 0 1px #ffffff50;
  pointer-events:none
}
.linkedin .ring {
  border-color:#8fc9ffb3;
  filter:drop-shadow(0 0 4px #2563eb66)
}
.github .ring {
  border-color:#e2e8f0b3;
  filter:drop-shadow(0 0 4px #e2e8f033)
}
.ring-back {
  z-index:1
}
.ring-front {
  z-index:3;
  clip-path:inset(50% 0 0 0)
}
.planet-label {
  position:absolute;
  top:42px;
  left:50%;
  transform:translateX(-50%);
  font-size:10px;
  font-weight:700;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:#a5e8f2;
  background:rgba(7,20,38,.8);
  border:1px solid var(--line);
  border-radius:5px;
  padding:2px 8px;
  white-space:nowrap
}
.planet-link:hover .planet,.planet-link:focus-visible .planet {
  transform:scale(1.2)
}
.orbit:has(.planet-link:hover) .orbiter,.orbit:has(.planet-link:focus-visible) .orbiter,.orbit:has(.planet-link:hover) .planet-link,.orbit:has(.planet-link:focus-visible) .planet-link {
  animation-play-state:paused
}
.scroll-down {
  position:absolute;
  bottom:32px;
  left:calc(50% - 12px);
  color:#63718a;
  animation:bob 2s ease-in-out infinite
}
.scroll-down .icon {
  width:24px;
  height:24px
}
.section {
  padding:96px 16px;
  scroll-margin-top:0
}
.container {
  max-width:1000px;
  margin:auto
}
.container.narrow {
  max-width:800px
}
.container.medium {
  max-width:900px
}
.section-heading {
  display:flex;
  align-items:center;
  gap:16px
}
.section-heading>span {
  font:14px/20px ui-monospace,monospace;
  color:#22d3ee99;
  white-space:nowrap
}
.section-heading h2 {
  font-size:36px;
  line-height:40px;
  font-weight:700;
  letter-spacing:-.8px
}
.section-heading>i {
  flex:1;
  height:1px;
  background:linear-gradient(90deg,#67e8f94d,transparent)
}
.section-body {
  margin-top:40px
}
.section-body>p {
  margin-bottom:16px
}
.panel {
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:16px
}
.accent {
  color:#a5e8f2
}
.small {
  font-size:12px;
  color:var(--dim)
}
.education {
  margin-top:24px;
  padding:20px;
  display:flex;
  gap:16px
}
.education>.icon {
  color:var(--cyan);
  width:24px;
  height:24px
}
.education h3 {
  font-size:16px;
  font-weight:600
}
.education p {
  margin-top:3px
}
.education .accent {
  font-size:14px
}
.skills {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:32px
}
.skills h3,.label {
  font:12px ui-monospace,monospace;
  color:#67e8f9b3;
  letter-spacing:1.2px;
  text-transform:uppercase;
  margin-bottom:12px
}
.chips {
  display:flex;
  flex-wrap:wrap;
  gap:6px
}
.chips>span {
  font-size:11px;
  line-height:16px;
  padding:3px 8px;
  background:#ffffff0d;
  border:1px solid #ffffff08;
  border-radius:3px;
  color:#aeb8ca
}
.skills .chips>span {
  font-size:12px;
  line-height:18px;
  padding:4px 10px
}
.project-grid,.achievement-grid,.leadership-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px
}
.project-card {
  padding:24px;
  text-align:left;
  transition:border-color .25s,transform .25s,box-shadow .25s
}
.project-card:hover {
  border-color:#67e8f940;
  transform:translateY(-4px);
  box-shadow:0 10px 40px #0003
}
.card-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font:12px ui-monospace,monospace;
  color:#22d3ee99;
  margin-bottom:16px
}
.card-top .icon {
  width:16px;
  height:16px;
  color:var(--dim)
}
.project-card h3 {
  font-size:20px;
  line-height:28px;
  font-weight:700;
  letter-spacing:-.5px
}
.role {
  display:block;
  font-size:14px;
  color:#a5e8f2
}
.project-card p {
  font-size:14px;
  line-height:20px;
  margin:12px 0 16px
}
.empty-state {
  padding:64px 24px;
  text-align:center;
  border-style:dashed
}
.shield {
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border:1px solid #67e8f933;
  border-radius:50%;
  background:#22d3ee0d;
  color:var(--cyan);
  margin:0 auto 20px
}
.shield .icon {
  width:28px;
  height:28px
}
.empty-state h3 {
  font-size:20px;
  font-weight:600;
  margin-bottom:8px
}
.empty-state p {
  font-size:14px;
  color:var(--dim)
}
.achievement {
  padding:24px
}
.trophy {
  color:#fbbf24;
  width:28px;
  height:28px;
  margin-bottom:16px
}
.award-line {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px
}
.award-line strong {
  font-size:24px;
  color:var(--cyan)
}
.award-line>span {
  font:12px ui-monospace,monospace;
  color:var(--dim)
}
.achievement h3 {
  font-size:18px;
  margin-bottom:8px
}
.achievement p {
  font-size:14px
}
.leadership {
  margin-top:32px
}
.leadership-card {
  padding:20px;
  display:flex;
  gap:16px
}
.leadership-card>.icon {
  color:var(--cyan);
  margin-top:2px
}
.leadership-card h3 {
  font-size:16px;
  font-weight:600
}
.leadership-card .accent {
  font-size:14px
}
.leadership-card .small {
  margin:4px 0 10px
}
.leadership-card p:last-child {
  font-size:14px;
  line-height:20px
}
.timeline {
  position:relative;
  margin-left:12px;
  padding-left:28px;
  border-left:1px solid #67e8f926;
  display:grid;
  gap:20px
}
.experience-card {
  padding:20px;
  display:flex;
  gap:16px;
  position:relative
}
.experience-card>.icon {
  color:var(--cyan);
  margin-top:2px
}
.timeline-dot {
  position:absolute;
  left:-35px;
  top:24px;
  width:12px;
  height:12px;
  border-radius:50%;
  border:2px solid #67e8f9;
  background:#07101f;
  box-shadow:0 0 12px #22d3ee40
}
.experience-card>div {
  flex:1
}
.experience-heading {
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center
}
.experience-heading h3 {
  font-size:18px;
  font-weight:600
}
.experience-heading>span {
  font:12px ui-monospace,monospace;
  color:var(--dim)
}
.experience-card .accent {
  font-size:14px;
  margin-top:2px
}
.experience-card .small {
  margin:4px 0 8px
}
.experience-card p:last-child {
  font-size:14px;
  line-height:20px
}
.contact-grid {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:32px
}
.contact-copy>p {
  margin-bottom:20px;
  line-height:24px
}
.contact-info {
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px;
  margin-bottom:20px;
  font-size:14px;
  border-radius:12px
}
.contact-info .icon {
  color:var(--cyan)
}
a.contact-info:hover {
  border-color:#67e8f940
}
.social-pills {
  display:flex;
  gap:12px;
  margin-bottom:28px
}
.social-pills a {
  display:flex;
  gap:8px;
  align-items:center;
  padding:8px 16px;
  border-radius:99px;
  border:1px solid var(--line);
  background:var(--panel);
  font-size:14px
}
.blue-dot,.white-dot {
  width:10px;
  height:10px;
  border-radius:50%;
  background:#2563eb;
  box-shadow:0 0 10px #2563eb80
}
.white-dot {
  background:#e2e8f0;
  box-shadow:0 0 10px #e2e8f080
}
.downloads {
  display:flex;
  gap:16px;
  font-size:14px;
  align-items:center
}
.downloads>a {
  color:var(--cyan)
}
.downloads>span {
  color:var(--dim);
  font-size:12px
}
.contact-form {
  padding:24px
}
.form-note {
  font-size:12px;
  line-height:18px;
  margin-bottom:16px
}
.contact-form label {
  display:block;
  font-size:12px;
  color:#9ca8bd;
  text-transform:uppercase;
  margin-bottom:4px
}
.contact-form input,.contact-form textarea {
  width:100%;
  border:1px solid var(--line);
  background:rgba(0,0,0,.18);
  color:#f8fafc;
  border-radius:8px;
  padding:10px 12px;
  font-size:14px;
  line-height:18px;
  margin-bottom:16px
}
.contact-form input::placeholder,.contact-form textarea::placeholder {
  color:#9da6b8
}
.contact-form textarea {
  min-height:118px;
  resize:vertical
}
.contact-form .primary {
  width:100%;
  padding:10px 18px
}
.contact-form .primary .icon {
  width:16px;
  height:16px
}
.form-status {
  font-size:12px;
  color:var(--cyan);
  margin-top:12px
}
footer {
  border-top:1px solid var(--line);
  padding:32px 16px;
  text-align:center
}
footer p {
  font-size:12px;
  color:#657087
}
footer p+p {
  margin-top:4px
}
dialog {
  width:min(600px,calc(100% - 32px));
  border:1px solid #67e8f933;
  border-radius:20px;
  background:#0b1224;
  color:#f8fafc;
  padding:0;
  box-shadow:0 0 60px #0008;
  max-height:85svh
}
dialog::backdrop {
  background:#020617b3;
  backdrop-filter:blur(8px)
}
.dialog-content {
  padding:32px;
  position:relative
}
.dialog-close {
  position:absolute;
  right:16px;
  top:12px;
  border:0;
  background:transparent;
  color:#a6b5c8;
  font-size:28px;
  padding:0 8px
}
.dialog-content .card-top {
  padding-right:24px
}
.dialog-content h2 {
  font-size:26px;
  line-height:34px;
  margin-bottom:4px
}
.dialog-content .accent {
  margin-bottom:20px
}
.dialog-content>p,.dialog-content li {
  font-size:14px;
  line-height:22px
}
.dialog-content ul {
  padding-left:20px;
  margin:20px 0 24px;
  color:#b0b7c8
}
.dialog-content li+li {
  margin-top:12px
}
.dialog-content li::marker {
  color:var(--cyan)
}
@keyframes orbit {
  from {
    transform:rotate(35deg)
  }
  to {
    transform:rotate(395deg)
  }
}
@keyframes counter-orbit {
  from {
    transform:rotate(-35deg)
  }
  to {
    transform:rotate(-395deg)
  }
}
@keyframes bob {
  0%,100% {
    transform:translateY(0)
  }
  50% {
    transform:translateY(6px)
  }
}
@media(min-width:1600px) {
  .hero-grid {
    grid-template-columns:583px 477px
  }
}
@media(max-width:1150px) {
  .nav-wrap {
    margin:0 24px
  }
  .hero-grid {
    max-width:1000px;
    grid-template-columns:1.2fr .8fr;
    gap:24px
  }
  h1 {
    font-size:52px
  }
  .subtitle {
    font-size:18px
  }
  .orbit {
    width:270px;
    height:270px
  }
  .solar-system {
    height:300px
  }
  nav a {
    padding:7px 9px
  }
}
@media(max-width:900px) {
  h1 {
    white-space:normal;
    font-size:48px
  }
  .hero-grid {
    grid-template-columns:1.3fr .7fr;
    gap:24px
  }
  .orbit {
    width:220px;
    height:220px
  }
  .hero-meta {
    gap:8px
  }
  .header .nav-wrap {
    margin:0 16px
  }
  nav a {
    padding:7px;
    font-size:10px
  }
  .brand {
    letter-spacing:2px
  }
  .section {
    padding:80px 24px
  }
  .skills {
    gap:16px
  }
  .contact-grid {
    grid-template-columns:1fr 1fr;
    gap:24px
  }
}
@media(max-width:700px) {
  .header {
    height:62px
  }
  .menu-toggle {
    display:flex;
    background:transparent;
    border:1px solid #67e8f926;
    border-radius:8px;
    width:38px;
    height:34px;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px
  }
  .menu-toggle span {
    width:17px;
    height:1px;
    background:var(--cyan)
  }
  nav {
    position:absolute;
    top:62px;
    left:0;
    right:0;
    display:none;
    background:#071020f5;
    padding:16px;
    backdrop-filter:blur(16px);
    border-bottom:1px solid #67e8f926;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px
  }
  nav.open {
    display:flex
  }
  nav a {
    font-size:11px;
    padding:9px 12px
  }
  .hero {
    padding:112px 24px 72px;
    min-height:100svh
  }
  .hero-grid {
    display:flex;
    flex-direction:column;
    gap:60px;
    align-items:stretch
  }
  .hero-copy {
    max-width:583px;
    margin:auto
  }
  h1 {
    font-size:44px;
    line-height:1.08;
    letter-spacing:-1px
  }
  .eyebrow {
    font-size:10px;
    letter-spacing:1.7px;
    margin-bottom:20px
  }
  .subtitle {
    font-size:18px;
    line-height:26px
  }
  .bio {
    font-size:14px;
    line-height:22px
  }
  .hero-meta {
    font-size:12px;
    gap:10px
  }
  .hero-actions {
    margin-top:24px
  }
  .stats {
    gap:8px
  }
  .stats strong {
    font-size:18px
  }
  .stats span {
    font-size:9px;
    line-height:15px
  }
  .stats>div {
    padding:12px 4px;
    min-height:78px
  }
  .solar-system {
    height:270px;
    margin-bottom:30px
  }
  .orbit {
    width:240px;
    height:240px
  }
  .section {
    padding:72px 24px
  }
  .section-heading {
    gap:12px
  }
  .section-heading h2 {
    font-size:30px;
    line-height:36px
  }
  .section-heading>span {
    font-size:12px
  }
  .section-body {
    margin-top:28px
  }
  .section-body>p {
    font-size:14px;
    line-height:23px
  }
  .project-grid,.achievement-grid,.leadership-grid,.contact-grid {
    grid-template-columns:1fr
  }
  .skills {
    grid-template-columns:1fr;
    gap:24px
  }
  .education {
    padding:16px;
    gap:12px
  }
  .education h3 {
    font-size:14px
  }
  .project-card {
    padding:20px
  }
  .project-card h3 {
    font-size:19px
  }
  .empty-state {
    padding:48px 20px
  }
  .award-line>span {
    font-size:11px
  }
  .experience-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:4px
  }
  .experience-heading h3 {
    font-size:16px
  }
  .experience-card {
    padding:16px;
    gap:12px
  }
  .experience-card>.icon {
    width:18px;
    height:18px
  }
  .timeline {
    padding-left:20px;
    margin-left:5px
  }
  .timeline-dot {
    left:-27px
  }
  .contact-form {
    padding:20px
  }
  .downloads {
    flex-wrap:wrap
  }
  .contact-info {
    overflow-wrap:anywhere
  }
  .dialog-content {
    padding:28px 24px
  }
  .dialog-content h2 {
    font-size:23px;
    line-height:30px
  }
  footer p {
    font-size:10px
  }
  .cursor-glow {
    display:none
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .orbiter,.planet-link,.scroll-down {
    animation:none
  }
  .github-orbit {
    transform:rotate(120deg)
  }
  .github-orbit .planet-link {
    transform:rotate(-120deg)
  }
  *,*::before,*::after {
    transition:none!important
  }
  .cursor-glow {
    display:none
  }
}
/* Reference-matched section composition. */
.youtube-orbit, .youtube-orbit .planet-link {
  animation-delay:-40s;
}
.youtube .sphere {
  background:radial-gradient(circle at 30% 25%,#ff6777,#ff0033 55%,#a40020);
  box-shadow:0 0 24px #ff003380;
}
.youtube-mark {
  width:24px;
  height:24px;
}
.youtube .ring {
  border-color:#fff0f2b3;
  filter:drop-shadow(0 0 4px #ff003366);
}
.youtube .planet-label {
  color:#ffe4e9;
}
@media(prefers-reduced-motion:reduce) {
  .youtube-orbit { transform:rotate(240deg); }
  .youtube-orbit .planet-link { transform:rotate(-240deg); }
}
.about-grid {
   display:grid;
   grid-template-columns:1.85fr 1fr;
   gap:32px;
}
.about-copy>p:first-child {
   font-size:18px;
   line-height:29.25px;
}
.about-copy>p+p {
   margin-top:16px;
   line-height:26px;
}
.education {
   margin-top:16px;
   padding:16px;
   gap:12px;
   border-radius:12px;
}
.education>.icon {
   width:20px;
   height:20px;
   margin-top:2px;
}
.education h3 {
   font-size:16px;
   line-height:24px;
}
.education p {
   margin-top:0;
}
.skills {
   display:block;
   margin-top:0;
}
.skills>div+div {
   margin-top:20px;
}
.skills h3 {
   font-weight:600;
   margin-bottom:8px;
}
.skills .chips>span {
   font-size:12px;
   line-height:16px;
   padding:4px 10px;
   border-radius:5px;
}
.empty-state {
   min-height:270px;
}
.empty-state h3 {
   font-size:18px;
   line-height:28px;
}
.empty-state p {
   line-height:20px;
}
.shield {
   margin-bottom:16px;
}
.achievement-grid,.leadership-grid {
   gap:16px;
}
.award-header {
   display:flex;
   align-items:center;
   gap:16px;
   margin-bottom:16px;
}
.award-icon {
   display:grid;
   place-items:center;
   width:56px;
   height:56px;
   border-radius:50%;
   background:linear-gradient(135deg,#22d3ee1f,#8b5cf633);
   flex:none;
}
.trophy {
   color:var(--cyan);
   width:24px;
   height:24px;
   margin:0;
}
.award-line {
   display:block;
   margin:0;
}
.award-line strong {
   display:block;
   font-size:24px;
   line-height:32px;
   font-weight:800;
}
.award-line>span {
   font:14px/20px ui-sans-serif,system-ui,sans-serif;
   color:#9ca8bd;
}
.achievement h3 {
   font-size:16px;
   line-height:24px;
   margin-bottom:4px;
}
.achievement p {
   line-height:20px;
}
.leadership {
   margin-top:48px;
}
.leadership .label {
   margin-bottom:16px;
}
.leadership-card>.icon {
   color:#c4b5fd;
}
.timeline {
   border:0;
   margin-left:0;
   padding-left:0;
   gap:16px;
}
.experience-icon {
   width:44px;
   height:44px;
   display:grid;
   place-items:center;
   flex:none;
   color:var(--cyan);
   border-radius:50%;
   background:linear-gradient(135deg,#22d3ee1f,#8b5cf626);
}
.experience-heading h3 {
   font-size:16px;
   line-height:24px;
}
.experience-heading>span {
   color:#22d3ee99;
   font-size:12px;
   line-height:16px;
}
.experience-card .accent {
   margin:0;
   line-height:20px;
}
.experience-card .small {
   margin:0 0 8px;
   line-height:16px;
}
.project-card .card-top {
   line-height:16px;
}
.primary,.secondary {
   line-height:20px;
}
.contact-form input {
   padding:9px 12px;
}
@media(max-width:700px) {
  
    .about-grid {
     grid-template-columns:1fr;
     gap:32px;
  }
  
    .about-copy>p:first-child {
     font-size:16px;
     line-height:26px;
  }
  
    .about-copy>p+p {
     font-size:14px;
     line-height:23px;
  }
  
    .experience-icon {
     width:36px;
     height:36px;
  }
  
    .experience-heading>span {
     font-size:11px;
  }
}

/* Keep section jumps aligned with the original's section inset. */
#cursor-stars {
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:81;
  pointer-events:none;
}
@media (prefers-reduced-motion:reduce), (pointer:coarse) {
  #cursor-stars { display:none; }
}
.constellations { opacity:.035; }
.brand, .card-top, .skills h3, .label, .section-heading>span, .experience-heading>span {
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
.skills h3, .label { letter-spacing:2px; }
.role { line-height:20px; }
.project-card .chips>span { padding:2px 8px; line-height:16.5px; }
.empty-state>p { margin:0; }
.empty-state { min-height:270px; }
.leadership-card .small { margin:0 0 8px; line-height:16px; }
@media(max-width:420px) {
  .stats strong { font-size:16px; line-height:24px; white-space:nowrap; }
}