:root{
  --bg:#131313;
  --bg-elev:#171717;
  --bg-soft:#1d1d1d;
  --panel:rgba(19,19,19,.82);
  --panel-strong:rgba(19,19,19,.94);
  --panel-soft:rgba(30,30,30,.78);
  --text:#f3f3f1;
  --muted:#a4a4a0;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.14);
  --accent:#ff6b3d;
  --accent-soft:rgba(255,107,61,.18);
  --accent-strong:#ff845e;
  --accent-ghost:rgba(255,107,61,.10);
  --cyan:#78e3ff;
  --ok:#65ff9c;
  --shadow:0 24px 80px rgba(0,0,0,.42);
  --particle:#ff845e;
  --particleLink:#ff6b3d;
  --cursor:#78e3ff;
  --grid-line:rgba(255,255,255,.045);
  --radius:22px;
  --radius-sm:14px;
}

html.theme-light{
  --bg:#f4f0ea;
  --bg-elev:#faf7f2;
  --bg-soft:#f0ebe4;
  --panel:rgba(250,247,242,.86);
  --panel-strong:rgba(250,247,242,.95);
  --panel-soft:rgba(255,252,247,.82);
  --text:#181614;
  --muted:#706a63;
  --line:rgba(24,22,20,.10);
  --line-strong:rgba(24,22,20,.16);
  --accent:#d94d22;
  --accent-soft:rgba(217,77,34,.14);
  --accent-strong:#ec6a42;
  --accent-ghost:rgba(217,77,34,.08);
  --cyan:#1a87a5;
  --shadow:0 24px 70px rgba(76,49,31,.12);
  --particle:#d94d22;
  --particleLink:#ec6a42;
  --cursor:#1a87a5;
  --grid-line:rgba(24,22,20,.05);
}

*{box-sizing:border-box}
html,body{min-height:100%}
html{
  color:var(--text);
  background:
    radial-gradient(1000px 700px at 18% 16%, rgba(255,107,61,.12), transparent 58%),
    radial-gradient(900px 680px at 82% 20%, rgba(120,227,255,.10), transparent 62%),
    linear-gradient(180deg, #101010 0%, #131313 45%, #161616 100%);
  background-attachment:fixed;
}
html.theme-light{
  background:
    radial-gradient(1000px 700px at 18% 16%, rgba(217,77,34,.10), transparent 58%),
    radial-gradient(900px 680px at 82% 20%, rgba(26,135,165,.08), transparent 62%),
    linear-gradient(180deg, #f7f3ee 0%, #f4f0ea 48%, #efe8df 100%);
  background-attachment:fixed;
}
body{
  margin:0;
  color:var(--text);
  font:15px/1.65 ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  overflow-x:hidden;
  background:transparent;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size:48px 48px;
  opacity:.55;
  z-index:0;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.9), rgba(0,0,0,.15));
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at top, rgba(255,255,255,.06), transparent 42%);
  opacity:.2;
  z-index:0;
}

#particles-js{position:fixed;inset:0;z-index:0;pointer-events:none;background:transparent}
#particle-canvas{position:fixed;inset:0;z-index:9998;pointer-events:none}
.cursor-hidden,.cursor-hidden body{cursor:none}
.custom-cursor{
  position:fixed;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:var(--cursor);
  box-shadow:0 0 12px rgba(120,227,255,.75),0 0 28px rgba(120,227,255,.35);
  pointer-events:none;
  z-index:9999;
}
@media (pointer:coarse){
  .cursor-hidden,.cursor-hidden body{cursor:auto}
  .custom-cursor,#particle-canvas{display:none!important}
}

.page{
  min-height:100vh;
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
}

.nav,.topbar{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 20px;
  margin:18px auto 0;
  width:min(1240px, calc(100% - 24px));
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(24,24,24,.88), rgba(19,19,19,.74));
  box-shadow:var(--shadow);
  backdrop-filter:blur(16px);
}
html.theme-light .nav,
html.theme-light .topbar{
  background:linear-gradient(180deg, rgba(250,247,242,.9), rgba(244,240,234,.82));
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--text);
  text-decoration:none;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--ok);
  box-shadow:0 0 0 4px rgba(101,255,156,.14), 0 0 18px rgba(101,255,156,.78);
  animation:statusPulse 4.8s ease-in-out infinite;
}
.brand-name{color:var(--accent)}
.menu{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.menu a{
  position:relative;
  display:inline-block;
  color:var(--muted);
  text-decoration:none;
  padding:9px 12px;
  border-radius:12px;
  border:1px solid transparent;
  transition:.18s ease;
}
.menu a:hover,
.menu a.active{
  color:var(--text);
  border-color:var(--line-strong);
  background:var(--accent-ghost);
}
.burger{
  display:none;
  margin-left:auto;
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--panel-soft);
  cursor:pointer;
}
.burger span{display:block;width:18px;height:2px;background:var(--text);margin:4px auto}
.theme-toggle{
  width:42px;
  height:42px;
  display:inline-grid;
  place-items:center;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--panel-soft);
  color:var(--text);
  cursor:pointer;
}
.theme-toggle .sun{display:none}
html.theme-light .theme-toggle .sun{display:inline}
html.theme-light .theme-toggle .moon{display:none}

.shell,
.portal-home,
.portal-page{
  width:min(1240px, calc(100% - 24px));
  margin:0 auto;
}
.portal-home{
  padding:28px 0 48px;
}
.hero{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:20px;
  align-items:stretch;
}
.portal-panel,
.about-panel,
.card,
.terminal-preview,
.resume-grid > .card,
.info-chip,
.mobile-actions,
.footer,
.kpi-card,
.module-card,
.module-list a,
.info-list li,
.quick-command,
.video-embed{
  position:relative;
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel-strong), var(--panel));
  box-shadow:var(--shadow);
}
.portal-panel,
.about-panel,
.card,
.resume-grid > .card,
.module-card,
.kpi-card,
.terminal-preview,
.video-embed{
  border-radius:var(--radius);
}
.info-chip,
.module-list a,
.quick-command,
.mobile-actions{
  border-radius:16px;
}
.panel-body{padding:26px}
.panel-kicker,
.section-kicker,
.k,
.soft{
  color:var(--accent-strong);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.hero h1,
.about-panel h1{
  margin:14px 0 14px;
  font-size:clamp(36px,7vw,78px);
  line-height:.96;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.glitch{
  position:relative;
  display:inline-block;
  color:var(--text);
  letter-spacing:.08em;
  text-shadow:0 0 22px rgba(255,107,61,.16), 0 0 36px rgba(255,107,61,.08);
  animation:glitchSkew 5.4s steps(1,end) infinite;
}
.glitch::before,
.glitch::after,
.glitch-lite::before,
.glitch-lite::after,
.glitch-nav::before,
.glitch-nav::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
}
.glitch::before,
.glitch::after{opacity:.46}
.glitch::before{
  color:rgba(255,107,61,.74);
  transform:translate(-2px,0);
  clip-path:inset(0 0 53% 0);
  animation:glitchSliceA 2.8s steps(2,end) infinite;
}
.glitch::after{
  color:rgba(120,227,255,.68);
  transform:translate(2px,0);
  clip-path:inset(56% 0 0 0);
  animation:glitchSliceB 3.6s steps(2,end) infinite;
}
.glitch-lite,
.glitch-nav{
  position:relative;
  display:inline-block;
  text-shadow:0 0 10px rgba(255,107,61,.12);
  animation:glitchFlicker 6.8s steps(1,end) infinite;
}
.glitch-lite::before,
.glitch-nav::before{
  color:rgba(255,107,61,.62);
  transform:translate(-1px,0);
  clip-path:inset(0 0 58% 0);
  animation:glitchSliceLiteA 4.6s steps(2,end) infinite;
}
.glitch-lite::after,
.glitch-nav::after{
  color:rgba(120,227,255,.58);
  transform:translate(1px,0);
  clip-path:inset(62% 0 0 0);
  animation:glitchSliceLiteB 5.2s steps(2,end) infinite;
}
.glitch-nav:hover,
.glitch-nav.active,
.glitch-lite:hover{
  text-shadow:0 0 14px rgba(255,107,61,.2), 0 0 22px rgba(120,227,255,.08);
}
@keyframes statusPulse{
  0%,100%{opacity:.82;transform:scale(1);box-shadow:0 0 0 4px rgba(101,255,156,.12),0 0 12px rgba(101,255,156,.55)}
  50%{opacity:1;transform:scale(1.08);box-shadow:0 0 0 6px rgba(101,255,156,.10),0 0 24px rgba(101,255,156,.92),0 0 38px rgba(101,255,156,.18)}
}
@keyframes glitchSkew{
  0%,89%,100%{transform:none}
  90%{transform:skewX(1deg)}
  91%{transform:skewX(-1.4deg)}
  92%{transform:none}
}
@keyframes glitchFlicker{
  0%,92%,100%{transform:none;opacity:1}
  93%{transform:translateX(.5px)}
  94%{transform:translateX(-.5px)}
  95%{transform:none;opacity:.96}
}
@keyframes glitchSliceA{
  0%,88%,100%{transform:translate(0,0);opacity:.28}
  89%{transform:translate(-3px,-1px);opacity:.7}
  90%{transform:translate(2px,1px);opacity:.48}
  91%{transform:translate(-1px,0);opacity:.62}
  92%{transform:translate(0,0);opacity:.34}
}
@keyframes glitchSliceB{
  0%,86%,100%{transform:translate(0,0);opacity:.26}
  87%{transform:translate(3px,1px);opacity:.68}
  88%{transform:translate(-2px,-1px);opacity:.44}
  89%{transform:translate(1px,0);opacity:.58}
  90%{transform:translate(0,0);opacity:.32}
}
@keyframes glitchSliceLiteA{
  0%,95%,100%{transform:translate(0,0);opacity:0}
  96%{transform:translate(-1px,0);opacity:.55}
  97%{transform:translate(1px,0);opacity:.24}
}
@keyframes glitchSliceLiteB{
  0%,94%,100%{transform:translate(0,0);opacity:0}
  95%{transform:translate(1px,0);opacity:.5}
  96%{transform:translate(-1px,0);opacity:.22}
}
.subtitle{
  color:var(--muted);
  font-size:16px;
  max-width:62ch;
}
.chips,
.info-grid,
.btnrow,
.kpi-grid,
.module-list,
.section-actions,
.cta,
.theme-group{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.chip,
.info-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  color:var(--text);
  background:rgba(255,255,255,.03);
  border:1px solid var(--line);
}
.chip{
  border-radius:999px;
}
.muted{color:var(--muted)}
.mt10{margin-top:10px}
.pt24{padding-top:24px}

ul{padding-left:18px}
li{margin:0 0 8px}
hr.soft{border:0;border-top:1px solid var(--line);margin:20px 0}

.logo-frame{
  display:grid;
  place-items:center;
  min-height:260px;
  border-radius:20px;
  overflow:hidden;
  border:1px solid var(--line-strong);
  background:
    radial-gradient(circle at top, rgba(255,107,61,.18), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
}
.logo-gif{
  width:min(420px,100%);
  max-width:100%;
  object-fit:contain;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.45));
}
.hero-meta{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:20px;
}
.kpi-card{
  padding:16px;
  border-radius:18px;
}
.kpi-card strong{
  display:block;
  margin-top:10px;
  font-size:24px;
  color:var(--text);
}
.kpi-card span{color:var(--muted)}
.quick-commands{display:grid;gap:12px;margin-top:18px}
.quick-command{
  padding:14px 16px;
  color:var(--text);
}
.quick-command code{
  color:var(--accent-strong);
  font-size:13px;
}
.section-block{margin-top:22px}
.section-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:16px;
  margin:0 0 14px;
}
.section-heading h2,
.about-panel h2,
.card h2,
.card h3{
  margin:0;
  font-size:20px;
  letter-spacing:.04em;
}
.section-heading p,
.about-panel p,
.card p{margin:10px 0 0}
.module-grid,
.resume-grid,
.info-grid,
.card-grid{
  display:grid;
  gap:16px;
}
.module-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.resume-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}
.howto-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.info-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:18px}
.card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.module-card{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:20px;
  text-decoration:none;
  color:var(--text);
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.module-card:hover,
.module-list a:hover,
.btn:hover{
  transform:translateY(-2px);
  border-color:var(--line-strong);
}
.module-card .module-title{
  font-size:18px;
  font-weight:700;
}
.module-card p{margin:0;color:var(--muted)}
.module-card .module-meta,
.info-chip .v,
.card .soft{color:var(--muted);font-size:13px}
.module-card .module-arrow{
  margin-top:auto;
  color:var(--accent-strong);
}
.about-panel,
.card{padding:24px}
.info-chip{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  padding:16px;
}
.info-chip .v{color:var(--text);font-size:14px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 15px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  color:var(--text);
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.btn-primary{
  background:var(--accent);
  color:#fffaf7;
  border-color:rgba(255,107,61,.45);
}
.btn-ghost{background:rgba(255,255,255,.02)}
.btn-icon{width:42px;padding:0}
.btn-glitch{box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)}
.btnrow{margin-top:18px}
.footer{
  margin:28px auto 22px;
  width:min(1240px, calc(100% - 24px));
  padding:14px 18px;
  border-radius:18px;
  color:var(--muted);
}
.footer span{display:block}
.mobile-actions{display:none}
.desktop-only{display:flex}
.cols2{columns:2;column-gap:18px;padding-left:18px}
.cols2 li{break-inside:avoid;margin:0 0 8px}

.video-title{
  margin-top:10px;
  color:var(--text);
  font-weight:700;
}
.video-embed{overflow:hidden;margin-top:14px}
.video-embed iframe{
  width:100%;
  aspect-ratio:16 / 9;
  display:block;
  border:0;
}

.portal-note{
  margin-top:16px;
  padding:14px 16px;
  border-left:3px solid var(--accent);
  background:rgba(255,255,255,.03);
  color:var(--muted);
}
.home-callout{
  display:grid;
  gap:16px;
}
.home-callout .card{min-height:100%}

/* terminal preview block on home */
.terminal-preview{
  padding:18px;
  border-radius:22px;
  overflow:hidden;
}
.terminal-preview pre{
  margin:0;
  white-space:pre-wrap;
  color:var(--text);
}
.terminal-preview .soft{display:block;margin-bottom:12px}

@media (max-width:1080px){
  .hero{grid-template-columns:1fr}
  .module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .nav,.topbar{padding:12px 14px}
  .burger{display:inline-grid;place-items:center}
  .menu{
    display:none;
    position:absolute;
    left:12px;
    right:12px;
    top:calc(100% + 8px);
    margin:0;
    padding:12px;
    border-radius:16px;
    border:1px solid var(--line);
    background:var(--panel-strong);
    flex-direction:column;
    align-items:stretch;
  }
  .menu.open{display:flex}
  .menu a{width:100%}
  .theme-toggle{margin-left:auto}
  .resume-grid,.howto-grid,.card-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  .module-grid,
  .info-grid,
  .hero-meta{grid-template-columns:1fr}
  .desktop-only{display:none}
  .mobile-actions{
    display:flex;
    gap:10px;
    padding:14px;
    margin-top:18px;
  }
  .cols2{columns:1}
}
@media (max-width:560px){
  .page{padding-bottom:20px}
  .portal-home,.shell,.portal-page{padding-left:0;padding-right:0}
  .nav,.topbar,.footer{width:min(1240px, calc(100% - 16px));margin-left:auto;margin-right:auto}
  .hero h1,.about-panel h1{font-size:34px}
  .module-grid{grid-template-columns:1fr}
  .about-panel,.card,.portal-panel,.module-card,.terminal-preview{padding:18px}
}


/* ============================================================
   v0.2.2 — glitch restore + green status lamp
   ============================================================ */
.brand .dot,
.nav .dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#66ff9f !important;
  box-shadow:0 0 0 4px rgba(102,255,159,.14), 0 0 18px rgba(102,255,159,.78), 0 0 34px rgba(102,255,159,.26) !important;
  animation:statusPulseGreen 5.8s ease-in-out infinite !important;
}

.menu a.glitch-nav,
.brand-name.glitch-lite{
  position:relative;
  isolation:isolate;
  display:inline-block;
}

.brand-name.glitch-lite{
  color:var(--accent);
  text-shadow:0 0 12px rgba(255,107,61,.18), 0 0 22px rgba(120,227,255,.06);
}

.menu a.glitch-nav{
  overflow:visible;
  text-shadow:0 0 8px rgba(255,107,61,.10);
  animation:navGlitchBase 5.6s steps(1,end) infinite;
}

.brand-name.glitch-lite::before,
.brand-name.glitch-lite::after,
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.34;
  mix-blend-mode:screen;
  will-change:transform, opacity, clip-path;
}

.brand-name.glitch-lite::before,
.menu a.glitch-nav::before{
  color:rgba(255,107,61,.82);
  transform:translate(-1px,0);
  clip-path:inset(0 0 56% 0);
  animation:labelGlitchA 2.4s steps(2,end) infinite;
}

.brand-name.glitch-lite::after,
.menu a.glitch-nav::after{
  color:rgba(120,227,255,.78);
  transform:translate(1px,0);
  clip-path:inset(58% 0 0 0);
  animation:labelGlitchB 3s steps(2,end) infinite;
}

.menu a.glitch-nav:hover,
.menu a.glitch-nav.active,
.brand-name.glitch-lite:hover{
  text-shadow:1px 0 rgba(120,227,255,.45), -1px 0 rgba(255,107,61,.35), 0 0 12px rgba(255,107,61,.22);
}

.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav.active::before,
.menu a.glitch-nav.active::after{
  opacity:.65;
  animation-duration:1.1s;
}

.hero-glitch{
  position:relative;
  isolation:isolate;
  font-weight:900;
  color:#ffe7dc;
  text-shadow:
    0 0 12px rgba(255,255,255,.06),
    0 0 26px rgba(255,107,61,.22),
    0 0 52px rgba(120,227,255,.10);
  animation:heroGlitchSkew 7s steps(1,end) infinite;
}

.hero-glitch::before,
.hero-glitch::after{
  opacity:.72;
  mix-blend-mode:screen;
}

.hero-glitch::before{
  color:rgba(255,107,61,.88);
  transform:translate(-3px,0);
  clip-path:inset(0 0 48% 0);
  animation:heroSliceA 1.9s steps(2,end) infinite;
}

.hero-glitch::after{
  color:rgba(120,227,255,.88);
  transform:translate(3px,0);
  clip-path:inset(52% 0 0 0);
  animation:heroSliceB 2.25s steps(2,end) infinite;
}

.hero-glitch .scanline{display:none}

.hero-glitch::marker{content:""}

.hero-glitch{
  background:linear-gradient(180deg, #fff5ef 0%, #ffd5c4 42%, #f4fdff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.hero-glitch::selection{background:rgba(255,107,61,.25)}

.hero-glitch + .subtitle{margin-top:2px}

.hero-glitch-wrap{position:relative}

.hero-glitch::before,
.hero-glitch::after{
  -webkit-text-fill-color:initial;
}

.hero-glitch::selection,
.menu a.glitch-nav::selection,
.brand-name.glitch-lite::selection{background:rgba(255,107,61,.18)}

.hero-glitch{filter:drop-shadow(0 0 14px rgba(255,107,61,.10))}

.hero-glitch:after{filter:drop-shadow(0 0 10px rgba(120,227,255,.16))}

.menu a.glitch-nav span{position:relative;z-index:2}

@keyframes statusPulseGreen{
  0%,100%{opacity:.84;transform:scale(1);box-shadow:0 0 0 4px rgba(102,255,159,.14),0 0 14px rgba(102,255,159,.56),0 0 28px rgba(102,255,159,.18)}
  50%{opacity:1;transform:scale(1.1);box-shadow:0 0 0 7px rgba(102,255,159,.10),0 0 22px rgba(102,255,159,.95),0 0 42px rgba(102,255,159,.24)}
}

@keyframes navGlitchBase{
  0%,88%,100%{transform:none}
  89%{transform:translateX(.5px)}
  90%{transform:translateX(-.75px)}
  91%{transform:none}
}

@keyframes labelGlitchA{
  0%,84%,100%{transform:translate(0,0);opacity:.18;clip-path:inset(0 0 58% 0)}
  85%{transform:translate(-2px,-1px);opacity:.62;clip-path:inset(10% 0 44% 0)}
  86%{transform:translate(1px,0);opacity:.38;clip-path:inset(0 0 56% 0)}
  87%{transform:translate(-1px,1px);opacity:.54;clip-path:inset(18% 0 34% 0)}
}

@keyframes labelGlitchB{
  0%,82%,100%{transform:translate(0,0);opacity:.16;clip-path:inset(60% 0 0 0)}
  83%{transform:translate(2px,1px);opacity:.58;clip-path:inset(62% 0 8% 0)}
  84%{transform:translate(-1px,-1px);opacity:.34;clip-path:inset(48% 0 22% 0)}
  85%{transform:translate(1px,0);opacity:.5;clip-path:inset(66% 0 0 0)}
}

@keyframes heroGlitchSkew{
  0%,92%,100%{transform:none;filter:drop-shadow(0 0 14px rgba(255,107,61,.10))}
  93%{transform:skewX(1deg) translateX(.5px)}
  94%{transform:skewX(-1.5deg) translateX(-.5px)}
  95%{transform:none;filter:drop-shadow(0 0 18px rgba(120,227,255,.12))}
}

@keyframes heroSliceA{
  0%,78%,100%{transform:translate(0,0);opacity:.30;clip-path:inset(0 0 50% 0)}
  79%{transform:translate(-6px,-1px);opacity:.88;clip-path:inset(8% 0 36% 0)}
  80%{transform:translate(4px,1px);opacity:.5;clip-path:inset(0 0 55% 0)}
  81%{transform:translate(-2px,0);opacity:.78;clip-path:inset(18% 0 26% 0)}
  82%{transform:translate(0,0);opacity:.42;clip-path:inset(0 0 50% 0)}
}

@keyframes heroSliceB{
  0%,74%,100%{transform:translate(0,0);opacity:.28;clip-path:inset(52% 0 0 0)}
  75%{transform:translate(6px,1px);opacity:.86;clip-path:inset(58% 0 6% 0)}
  76%{transform:translate(-4px,-1px);opacity:.46;clip-path:inset(44% 0 14% 0)}
  77%{transform:translate(2px,0);opacity:.72;clip-path:inset(64% 0 0 0)}
  78%{transform:translate(0,0);opacity:.38;clip-path:inset(52% 0 0 0)}
}

html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#22b15c !important;
  box-shadow:0 0 0 4px rgba(34,177,92,.12), 0 0 18px rgba(34,177,92,.58), 0 0 28px rgba(34,177,92,.18) !important;
}

html.theme-light .menu a.glitch-nav:hover,
html.theme-light .menu a.glitch-nav.active,
html.theme-light .brand-name.glitch-lite:hover{
  text-shadow:1px 0 rgba(26,135,165,.30), -1px 0 rgba(217,77,34,.24), 0 0 10px rgba(217,77,34,.14);
}

html.theme-light .hero-glitch{
  color:#1f1814;
  background:linear-gradient(180deg, #1b140f 0%, #ad3f1d 44%, #135f77 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
}



/* ============================================================
   v0.2.3 — cleaner tabs, stronger lamp, tighter surfaces
   ============================================================ */

:root{
  --radius:16px;
  --radius-sm:10px;
}

.nav,
.topbar{
  border-radius:14px;
}

.portal-panel,
.about-panel,
.card,
.resume-grid > .card,
.module-card,
.kpi-card,
.terminal-preview,
.video-embed{
  border-radius:16px;
}

.logo-frame{border-radius:12px}
.kpi-card,
.module-card{border-radius:14px}
.info-chip,
.module-list a,
.quick-command,
.mobile-actions,
.btn,
.theme-toggle,
.burger{
  border-radius:8px;
}

.chip{
  border-radius:8px;
}

.footer{
  border-radius:12px;
}

.menu{
  gap:6px;
}

.menu a{
  padding:10px 14px;
  border-radius:8px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.025);
  color:var(--tabText, var(--muted));
  box-shadow:none;
}

.menu a:hover,
.menu a.active{
  color:var(--text);
  border-color:var(--line-strong);
  background:var(--accent-ghost);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}

/* Bring back the original-style hover glitch instead of duplicated label layers */
.menu a.glitch-nav{
  text-shadow:none;
  animation:none;
  isolation:auto;
}

.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:none !important;
  animation:none !important;
  opacity:0 !important;
}

.menu a.glitch-nav:hover{
  text-shadow:
    1px 0 rgba(120,227,255,.32),
    -1px 0 rgba(255,107,61,.24);
  animation:tabGlitchClassic .42s steps(2,end) both;
}

.menu a.glitch-nav.active{
  text-shadow:none;
}

@keyframes tabGlitchClassic{
  0%{ transform:translate(0,0); filter:none; }
  20%{ transform:translate(1px,-1px); filter:contrast(1.05); }
  40%{ transform:translate(-1px,1px); }
  60%{ transform:translate(2px,0); }
  100%{ transform:translate(0,0); filter:none; }
}

/* Keep the brand clean */
.brand-name.glitch-lite{
  text-shadow:none;
  animation:none;
}
.brand-name.glitch-lite::before,
.brand-name.glitch-lite::after{
  content:none !important;
  animation:none !important;
  opacity:0 !important;
}

/* Brighter radar-like green lamp without overlapping text */
.brand .dot,
.nav .dot{
  width:9px;
  height:9px;
  margin-right:2px;
  background:#4dff8f !important;
  box-shadow:
    0 0 0 2px rgba(77,255,143,.12),
    0 0 12px rgba(77,255,143,.92),
    0 0 20px rgba(77,255,143,.30) !important;
  animation:statusPulseRadar 2.2s ease-out infinite !important;
}

@keyframes statusPulseRadar{
  0%{
    opacity:.92;
    transform:scale(1);
    box-shadow:
      0 0 0 0 rgba(77,255,143,.32),
      0 0 10px rgba(77,255,143,.82),
      0 0 18px rgba(77,255,143,.22);
  }
  68%{
    opacity:1;
    transform:scale(1.05);
    box-shadow:
      0 0 0 5px rgba(77,255,143,0),
      0 0 16px rgba(77,255,143,1),
      0 0 22px rgba(77,255,143,.26);
  }
  100%{
    opacity:.94;
    transform:scale(1);
    box-shadow:
      0 0 0 0 rgba(77,255,143,0),
      0 0 10px rgba(77,255,143,.82),
      0 0 18px rgba(77,255,143,.22);
  }
}

/* Stronger visible hero glitch */
.hero-glitch{
  color:#f8efe9 !important;
  background:none !important;
  -webkit-text-fill-color:initial !important;
  text-shadow:
    0 0 10px rgba(255,255,255,.03),
    2px 0 0 rgba(120,227,255,.12),
    -2px 0 0 rgba(255,107,61,.10),
    0 0 22px rgba(255,107,61,.18);
  animation:heroGlitchPulse 4.8s steps(1,end) infinite;
  filter:none !important;
}

.hero-glitch::before,
.hero-glitch::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  mix-blend-mode:screen;
  -webkit-text-fill-color:initial !important;
}

.hero-glitch::before{
  color:rgba(255,107,61,.84);
  transform:translate(-2px,0);
  clip-path:inset(0 0 54% 0);
  opacity:.48;
  animation:heroSliceA23 2.2s steps(2,end) infinite;
}

.hero-glitch::after{
  color:rgba(120,227,255,.84);
  transform:translate(2px,0);
  clip-path:inset(56% 0 0 0);
  opacity:.44;
  animation:heroSliceB23 2.9s steps(2,end) infinite;
}

@keyframes heroGlitchPulse{
  0%,88%,100%{ transform:none; }
  89%{ transform:skewX(1deg) translateX(.5px); }
  90%{ transform:skewX(-1.4deg) translateX(-.5px); }
  91%{ transform:none; }
}

@keyframes heroSliceA23{
  0%,82%,100%{ transform:translate(-2px,0); opacity:.34; clip-path:inset(0 0 54% 0); }
  83%{ transform:translate(-6px,-1px); opacity:.9; clip-path:inset(8% 0 36% 0); }
  84%{ transform:translate(3px,1px); opacity:.52; clip-path:inset(0 0 58% 0); }
  85%{ transform:translate(-1px,0); opacity:.72; clip-path:inset(18% 0 28% 0); }
}

@keyframes heroSliceB23{
  0%,80%,100%{ transform:translate(2px,0); opacity:.30; clip-path:inset(56% 0 0 0); }
  81%{ transform:translate(6px,1px); opacity:.86; clip-path:inset(60% 0 4% 0); }
  82%{ transform:translate(-3px,-1px); opacity:.46; clip-path:inset(46% 0 14% 0); }
  83%{ transform:translate(1px,0); opacity:.68; clip-path:inset(64% 0 0 0); }
}

.section-heading{
  align-items:center;
}

.section-heading p{
  display:none;
}

.portal-note,
.quick-commands,
.btnrow-home,
.home-page-actions{
  display:none !important;
}

.module-card p{
  margin-top:0;
  color:var(--muted);
  font-size:13px;
}

html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#17b857 !important;
  box-shadow:
    0 0 0 2px rgba(23,184,87,.12),
    0 0 12px rgba(23,184,87,.70),
    0 0 18px rgba(23,184,87,.18) !important;
}

html.theme-light .menu a{
  background:rgba(255,255,255,.68);
}

html.theme-light .hero-glitch{
  color:#1c1713 !important;
  text-shadow:
    0 0 0 rgba(0,0,0,0),
    2px 0 0 rgba(26,135,165,.10),
    -2px 0 0 rgba(217,77,34,.08);
}


/* ============================================================
   v0.2.4 — responsive home polish, stronger amber tab sweep,
   tighter signal panel, brighter green status lamp
   ============================================================ */

.hero{
  grid-template-columns:minmax(0,1.16fr) minmax(280px,.84fr);
  align-items:start;
}
.portal-home{padding:24px 0 40px}
.panel-body{padding:24px}
.section-block{margin-top:18px}
.home-callout{
  align-self:start;
  align-content:start;
}
.home-callout .portal-panel{
  height:auto;
}
.logo-frame{
  min-height:0;
  aspect-ratio:16 / 10;
  padding:14px;
  align-content:center;
}
.logo-gif{
  width:100%;
  max-width:420px;
  max-height:min(32vw, 250px);
}
.subtitle{margin-bottom:14px}
.hero-meta{margin-top:18px}
.module-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.module-card{
  min-height:188px;
}

/* stronger green lamp, faster radar pulse without spilling into text */
.brand .dot,
.nav .dot{
  width:9px;
  height:9px;
  background:#59ff8f !important;
  box-shadow:
    0 0 0 2px rgba(89,255,143,.18),
    0 0 16px rgba(89,255,143,.96),
    0 0 26px rgba(89,255,143,.34) !important;
  animation:statusPulseRadar 1.65s ease-out infinite !important;
}

@keyframes statusPulseRadar{
  0%{
    transform:scale(1);
    opacity:.96;
    box-shadow:
      0 0 0 0 rgba(89,255,143,.34),
      0 0 12px rgba(89,255,143,.96),
      0 0 20px rgba(89,255,143,.26);
  }
  68%{
    transform:scale(1.06);
    opacity:1;
    box-shadow:
      0 0 0 6px rgba(89,255,143,0),
      0 0 20px rgba(89,255,143,1),
      0 0 30px rgba(89,255,143,.32);
  }
  100%{
    transform:scale(1);
    opacity:.96;
    box-shadow:
      0 0 0 0 rgba(89,255,143,0),
      0 0 12px rgba(89,255,143,.96),
      0 0 20px rgba(89,255,143,.26);
  }
}

/* restore original-style tab glitch feel, but tuned for amber portal theme */
.menu a{
  position:relative;
  overflow:hidden;
}
.menu a.glitch-nav{
  text-shadow:none;
  animation:none;
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:"" !important;
  position:absolute;
  inset:-1px;
  pointer-events:none;
  opacity:0;
  mix-blend-mode:screen;
  transform:translateX(-18%);
  background:linear-gradient(90deg,
    rgba(255,107,61,0),
    rgba(255,107,61,.34),
    rgba(255,157,77,.24),
    rgba(120,227,255,.16),
    rgba(255,107,61,0));
}
.menu a.glitch-nav::after{
  transform:translateX(18%);
  background:linear-gradient(90deg,
    rgba(120,227,255,0),
    rgba(120,227,255,.18),
    rgba(255,150,90,.30),
    rgba(255,107,61,.18),
    rgba(120,227,255,0));
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible{
  text-shadow:
    1px 0 rgba(120,227,255,.44),
    -1px 0 rgba(255,107,61,.42),
    0 0 12px rgba(255,136,94,.18);
  animation:tabGlitchClassic .42s steps(2,end) both;
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav:focus-visible::before,
.menu a.glitch-nav:focus-visible::after{
  opacity:1 !important;
  animation:tabSweepAmber .62s steps(2,end) both;
}
.menu a.glitch-nav.active{
  text-shadow:
    0 0 10px rgba(255,136,94,.14);
}

@keyframes tabSweepAmber{
  0%{clip-path:inset(44% 0 40% 0);transform:translateX(-8%);filter:blur(.2px)}
  38%{clip-path:inset(8% 0 72% 0);transform:translateX(0)}
  72%{clip-path:inset(64% 0 14% 0);transform:translateX(-6%)}
  100%{clip-path:inset(0 0 0 0);opacity:0}
}

/* keep hero tighter and responsive */
@media (max-width:1180px){
  .hero{grid-template-columns:minmax(0,1fr) minmax(300px,.8fr)}
  .logo-gif{max-height:220px}
}
@media (max-width:1080px){
  .hero{grid-template-columns:1fr}
  .home-callout{max-width:none}
  .logo-frame{aspect-ratio:16 / 8}
  .logo-gif{max-height:210px}
}
@media (max-width:720px){
  .portal-home{padding:18px 0 32px}
  .panel-body{padding:18px}
  .logo-frame{aspect-ratio:auto;padding:12px}
  .logo-gif{max-height:180px}
}


/* ============================================================
   v0.2.5 — hero compaction + unified signal summary + live lamp
   ============================================================ */
.hero{
  grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);
  gap:18px;
  align-items:start;
}

.hero > .portal-panel{
  min-height:100%;
}

.home-callout{
  align-self:stretch;
}

.signal-panel{
  display:grid;
  gap:14px;
  align-content:start;
  height:100%;
}

.logo-frame{
  aspect-ratio:16 / 8.8;
  padding:12px;
}

.logo-gif{
  width:100%;
  max-width:100%;
  max-height:240px;
}

.hero-summary{
  display:grid;
  gap:0;
  padding:4px 0;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  overflow:hidden;
}

.summary-item{
  display:grid;
  gap:6px;
  padding:14px 16px;
}

.summary-item + .summary-item{
  border-top:1px solid var(--line);
}

.summary-item strong{
  font-size:20px;
  line-height:1.15;
  color:var(--text);
}

.summary-item span:last-child{
  color:var(--muted);
}

.hero .subtitle{
  margin-bottom:14px;
}

.hero .chips{
  margin-top:10px;
}

.brand .dot,
.nav .dot{
  width:10px;
  height:10px;
  background:#63ff93 !important;
  box-shadow:
    0 0 0 2px rgba(99,255,147,.22),
    0 0 14px rgba(99,255,147,1),
    0 0 26px rgba(99,255,147,.84),
    0 0 40px rgba(99,255,147,.28) !important;
  animation:statusPulseRadarLive 1.2s ease-out infinite !important;
}

@keyframes statusPulseRadarLive{
  0%{
    transform:scale(1);
    opacity:.98;
    box-shadow:
      0 0 0 0 rgba(99,255,147,.34),
      0 0 12px rgba(99,255,147,.98),
      0 0 22px rgba(99,255,147,.64),
      0 0 34px rgba(99,255,147,.18);
  }
  65%{
    transform:scale(1.08);
    opacity:1;
    box-shadow:
      0 0 0 7px rgba(99,255,147,0),
      0 0 18px rgba(99,255,147,1),
      0 0 28px rgba(99,255,147,.90),
      0 0 42px rgba(99,255,147,.24);
  }
  100%{
    transform:scale(1);
    opacity:.98;
    box-shadow:
      0 0 0 0 rgba(99,255,147,0),
      0 0 12px rgba(99,255,147,.98),
      0 0 22px rgba(99,255,147,.64),
      0 0 34px rgba(99,255,147,.18);
  }
}

html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#18c75b !important;
  box-shadow:
    0 0 0 2px rgba(24,199,91,.18),
    0 0 14px rgba(24,199,91,.88),
    0 0 24px rgba(24,199,91,.42),
    0 0 36px rgba(24,199,91,.16) !important;
}

@media (max-width:1180px){
  .hero{
    grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);
  }
}

@media (max-width:1080px){
  .hero{
    grid-template-columns:1fr;
  }

  .signal-panel{
    height:auto;
  }

  .logo-frame{
    aspect-ratio:16 / 7.8;
  }
}

@media (max-width:720px){
  .summary-item{
    padding:13px 14px;
  }

  .summary-item strong{
    font-size:18px;
  }

  .logo-frame{
    aspect-ratio:auto;
  }

  .logo-gif{
    max-height:190px;
  }
}


/* ============================================================
   v0.2.6 — rectangular system polish, live green radar, 
   stronger original nav glitch, unified right summary, theme persistence
   ============================================================ */
:root{
  --radius:14px;
  --radius-sm:9px;
}

.nav,
.topbar,
.portal-panel,
.about-panel,
.card,
.resume-grid > .card,
.module-card,
.kpi-card,
.terminal-preview,
.video-embed,
.footer,
.hero-summary,
.logo-frame,
.info-chip,
.module-list a,
.quick-command,
.mobile-actions,
.menu a,
.chip,
.btn,
.btn-ghost,
.theme-toggle,
.burger{
  border-radius:12px !important;
}

.hero{
  grid-template-columns:minmax(0,1.04fr) minmax(330px,.96fr) !important;
  gap:16px !important;
  align-items:start !important;
}

.hero-main,
.hero > .portal-panel:first-child{
  min-height:auto !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-self:start !important;
}

.home-callout,
.signal-panel{
  align-self:start !important;
  height:auto !important;
}

.hero .panel-kicker{margin-bottom:8px}
.hero h1{margin:10px 0 10px !important}
.hero .subtitle{margin:0 0 14px !important}
.hero .chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 !important;
}
.chip{padding:8px 12px !important}

.logo-frame{
  aspect-ratio:16 / 7.2 !important;
  min-height:0 !important;
  padding:12px !important;
}
.logo-gif{
  width:100%;
  max-width:100%;
  height:100%;
  max-height:230px !important;
  object-fit:contain;
}

.hero-summary{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 !important;
  padding:0 !important;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.012)) !important;
}
.summary-item{
  display:grid !important;
  gap:5px !important;
  padding:13px 14px !important;
  min-height:110px;
  align-content:start;
}
.summary-item + .summary-item{border-top:none !important}
.summary-item:nth-child(2n){border-left:1px solid var(--line)}
.summary-item:nth-child(n+3){border-top:1px solid var(--line)}
.summary-item strong{
  font-size:15px !important;
  line-height:1.2 !important;
}
.summary-item span:last-child{
  font-size:13px;
  line-height:1.55;
}

/* stronger original-style amber nav glitch */
.menu a.glitch-nav{
  position:relative;
  overflow:visible;
  text-shadow:0 0 12px rgba(255,126,82,.16);
  animation:glitchFlicker 6.3s steps(1,end) infinite;
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:attr(data-text) !important;
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.32;
  mix-blend-mode:screen;
}
.menu a.glitch-nav::before{
  color:rgba(255,132,84,.82);
  transform:translate(-1px,0);
  clip-path:inset(0 0 58% 0);
  animation:navSliceAmberA 4.1s steps(2,end) infinite;
}
.menu a.glitch-nav::after{
  color:rgba(120,227,255,.62);
  transform:translate(1px,0);
  clip-path:inset(62% 0 0 0);
  animation:navSliceAmberB 4.9s steps(2,end) infinite;
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  text-shadow:
    1px 0 rgba(255,132,84,.42),
    -1px 0 rgba(120,227,255,.28),
    0 0 16px rgba(255,136,94,.22);
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav.active::before,
.menu a.glitch-nav.active::after,
.menu a.glitch-nav:focus-visible::before,
.menu a.glitch-nav:focus-visible::after{
  opacity:.56;
}
@keyframes navSliceAmberA{
  0%,93%,100%{transform:translate(0,0);opacity:.14;clip-path:inset(0 0 58% 0)}
  94%{transform:translate(-2px,0);opacity:.78;clip-path:inset(12% 0 42% 0)}
  95%{transform:translate(1px,0);opacity:.32;clip-path:inset(0 0 55% 0)}
}
@keyframes navSliceAmberB{
  0%,91%,100%{transform:translate(0,0);opacity:.14;clip-path:inset(62% 0 0 0)}
  92%{transform:translate(2px,0);opacity:.68;clip-path:inset(60% 0 10% 0)}
  93%{transform:translate(-1px,0);opacity:.28;clip-path:inset(52% 0 14% 0)}
}

/* brighter small lamp with contained live radar */
.brand .dot,
.nav .dot{
  position:relative;
  display:inline-block;
  width:8px !important;
  height:8px !important;
  background:#61ff92 !important;
  box-shadow:
    0 0 0 2px rgba(97,255,146,.18),
    0 0 14px rgba(97,255,146,1),
    0 0 24px rgba(97,255,146,.88),
    0 0 34px rgba(97,255,146,.22) !important;
  animation:statusPulseRadarLive26 1.05s ease-out infinite !important;
}
.brand .dot::after,
.nav .dot::after{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:50%;
  border:1px solid rgba(97,255,146,.52);
  opacity:0;
  transform:scale(.45);
  animation:statusRingLive26 1.05s ease-out infinite;
}
@keyframes statusPulseRadarLive26{
  0%{
    transform:scale(1);
    box-shadow:
      0 0 0 2px rgba(97,255,146,.18),
      0 0 12px rgba(97,255,146,.98),
      0 0 22px rgba(97,255,146,.86),
      0 0 30px rgba(97,255,146,.18);
  }
  62%{
    transform:scale(1.08);
    box-shadow:
      0 0 0 2px rgba(97,255,146,.18),
      0 0 16px rgba(97,255,146,1),
      0 0 26px rgba(97,255,146,.92),
      0 0 36px rgba(97,255,146,.22);
  }
  100%{
    transform:scale(1);
    box-shadow:
      0 0 0 2px rgba(97,255,146,.18),
      0 0 12px rgba(97,255,146,.98),
      0 0 22px rgba(97,255,146,.86),
      0 0 30px rgba(97,255,146,.18);
  }
}
@keyframes statusRingLive26{
  0%{opacity:.58;transform:scale(.45)}
  72%{opacity:0;transform:scale(1.75)}
  100%{opacity:0;transform:scale(1.9)}
}
html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#17c95d !important;
}
html.theme-light .brand .dot::after,
html.theme-light .nav .dot::after{
  border-color:rgba(23,201,93,.44);
}

@media (max-width:1180px){
  .hero{
    grid-template-columns:minmax(0,1fr) minmax(310px,.92fr) !important;
  }
}
@media (max-width:980px){
  .hero{grid-template-columns:1fr !important}
  .hero-summary{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media (max-width:720px){
  .hero-summary{grid-template-columns:1fr !important}
  .summary-item:nth-child(2n){border-left:none !important}
  .summary-item:nth-child(n+2){border-top:1px solid var(--line) !important}
}


/* v0.2.7 — hero split fixed: title + gif top, 4 facts below */
.hero.hero-portal{
  display:grid !important;
  grid-template-columns:minmax(0,1.16fr) minmax(320px,.84fr) !important;
  gap:18px !important;
  align-items:stretch;
}
.hero-panel{
  min-width:0;
  min-height:100%;
}
.hero-panel--copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:312px;
}
.hero-panel--signal{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:312px;
}
.hero-panel--signal .section-kicker{
  margin-bottom:12px;
}
.hero-panel--signal .logo-frame{
  flex:1;
  width:100%;
  min-height:250px;
  aspect-ratio:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.hero-panel--signal .logo-gif{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:240px;
  object-fit:contain;
}
.hero-facts{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.fact-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
  min-height:188px;
  padding:20px 18px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(20,20,20,.88), rgba(16,16,16,.74));
  box-shadow:var(--shadow);
  backdrop-filter:blur(14px);
  overflow:hidden;
}
html.theme-light .fact-card{
  background:linear-gradient(180deg, rgba(250,247,242,.94), rgba(245,240,232,.82));
}
.fact-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,107,61,.06), transparent 32%, transparent 100%);
}
.fact-card strong,
.fact-card span{
  position:relative;
  z-index:1;
}
.fact-card strong{
  color:var(--text);
  font-size:clamp(16px,1.5vw,20px);
  line-height:1.2;
}
.fact-card span:last-child{
  color:var(--muted);
  line-height:1.7;
}
.fact-card .section-kicker{
  margin:0;
}
.hero-main .chips{
  margin-top:18px;
}
.hero-main .subtitle{
  max-width:700px;
}

/* smaller but stronger live status lamp */
.brand .dot,
.nav .dot{
  width:7px !important;
  height:7px !important;
  background:#5fff89 !important;
  box-shadow:
    0 0 0 2px rgba(95,255,137,.20),
    0 0 16px rgba(95,255,137,1),
    0 0 28px rgba(95,255,137,.96),
    0 0 42px rgba(95,255,137,.32) !important;
  animation:statusPulseRadarLive27 .9s ease-out infinite !important;
}
.brand .dot::before,
.nav .dot::before,
.brand .dot::after,
.nav .dot::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
.brand .dot::before,
.nav .dot::before{
  inset:-5px;
  border:1px solid rgba(95,255,137,.56);
  opacity:.75;
}
.brand .dot::after,
.nav .dot::after{
  inset:-8px;
  border:1px solid rgba(95,255,137,.42);
  opacity:0;
  transform:scale(.38);
  animation:statusRingLive27 .9s ease-out infinite;
}
@keyframes statusPulseRadarLive27{
  0%{
    transform:scale(1);
    box-shadow:
      0 0 0 2px rgba(95,255,137,.18),
      0 0 14px rgba(95,255,137,1),
      0 0 24px rgba(95,255,137,.92),
      0 0 36px rgba(95,255,137,.26);
  }
  55%{
    transform:scale(1.12);
    box-shadow:
      0 0 0 2px rgba(95,255,137,.22),
      0 0 18px rgba(95,255,137,1),
      0 0 32px rgba(95,255,137,.98),
      0 0 46px rgba(95,255,137,.34);
  }
  100%{
    transform:scale(1);
    box-shadow:
      0 0 0 2px rgba(95,255,137,.18),
      0 0 14px rgba(95,255,137,1),
      0 0 24px rgba(95,255,137,.92),
      0 0 36px rgba(95,255,137,.26);
  }
}
@keyframes statusRingLive27{
  0%{opacity:.7;transform:scale(.38)}
  76%{opacity:0;transform:scale(1.65)}
  100%{opacity:0;transform:scale(1.9)}
}
html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#12bf57 !important;
}
html.theme-light .brand .dot::before,
html.theme-light .nav .dot::before{
  border-color:rgba(18,191,87,.52);
}
html.theme-light .brand .dot::after,
html.theme-light .nav .dot::after{
  border-color:rgba(18,191,87,.38);
}

/* keep radius more rectangular site-wide */
.portal-panel,
.about-panel,
.module-card,
.fact-card,
.info-chip,
.chip,
.theme-toggle,
.logo-frame{
  border-radius:16px;
}
.menu a,
button,
.btn{
  border-radius:14px;
}

@media (max-width:1180px){
  .hero.hero-portal{
    grid-template-columns:minmax(0,1fr) minmax(280px,.8fr) !important;
  }
  .hero-facts{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:860px){
  .hero.hero-portal{
    grid-template-columns:1fr !important;
  }
  .hero-panel--copy,
  .hero-panel--signal{
    min-height:auto;
  }
  .hero-panel--signal .logo-frame{
    min-height:200px;
  }
}
@media (max-width:640px){
  .hero-facts,
  .module-grid{
    grid-template-columns:1fr !important;
  }
  .fact-card{
    min-height:auto;
  }
}

/* v0.3.0 — home cleanup: equal hero panels, move summaries to About, cleaner nav glitch */
.hero.hero-portal{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}
.hero-panel--copy,
.hero-panel--signal{
  min-height:318px !important;
}
.hero-panel--copy{
  justify-content:center !important;
}
.hero-panel--signal{
  justify-content:flex-start !important;
}
.hero-panel--signal .logo-frame,
.hero-panel--copy{
  height:100%;
}
.hero-panel--signal .logo-frame{
  min-height:0 !important;
}
.hero-facts{
  display:none !important;
}

.about-summaries{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
  margin:18px 0 20px;
}
.about-summary{
  position:relative;
  min-width:0;
  padding:18px 18px 16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(20,20,20,.88), rgba(16,16,16,.74));
  box-shadow:var(--shadow);
  overflow:hidden;
}
.about-summary::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,107,61,.05), transparent 34%, transparent 100%);
}
.about-summary > *{position:relative;z-index:1}
.about-summary strong{
  display:block;
  margin:8px 0 8px;
  font-size:clamp(16px, 1.6vw, 20px);
  line-height:1.2;
  color:var(--text);
}
.about-summary p{
  margin:0;
  color:var(--muted);
  line-height:1.7;
}
html.theme-light .about-summary{
  background:linear-gradient(180deg, rgba(250,247,242,.94), rgba(245,240,232,.82));
}

/* cleaner nav glitch: subtle chromatic jitter instead of duplicated text */
.menu a.glitch-nav{
  animation:none !important;
  text-shadow:0 0 8px rgba(255,107,61,.08);
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:none !important;
  display:none !important;
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  color:var(--text);
  text-shadow:
    -0.7px 0 rgba(255,107,61,.52),
     0.7px 0 rgba(120,227,255,.34),
     0 0 12px rgba(255,107,61,.18);
  animation:navGlitchClean28 1.7s steps(1,end) infinite;
}
@keyframes navGlitchClean28{
  0%,100%{transform:translate(0,0)}
  16%{transform:translate(.35px,-.15px)}
  18%{transform:translate(-.55px,.1px)}
  20%{transform:translate(.2px,0)}
  56%{transform:translate(0,0)}
  58%{transform:translate(.4px,.12px)}
  60%{transform:translate(-.3px,-.12px)}
  62%{transform:translate(0,0)}
}
html.theme-light .menu a.glitch-nav:hover,
html.theme-light .menu a.glitch-nav:focus-visible,
html.theme-light .menu a.glitch-nav.active{
  text-shadow:
    -0.6px 0 rgba(217,77,34,.46),
     0.6px 0 rgba(26,135,165,.28),
     0 0 10px rgba(217,77,34,.14);
}

/* smaller lamp, stronger glow, tighter live radar */
.brand .dot,
.nav .dot{
  width:6px !important;
  height:6px !important;
  background:#5fff89 !important;
  box-shadow:
    0 0 0 2px rgba(95,255,137,.18),
    0 0 18px rgba(95,255,137,1),
    0 0 32px rgba(95,255,137,.95),
    0 0 48px rgba(95,255,137,.28) !important;
  animation:statusPulseRadar28 .82s ease-out infinite !important;
}
.brand .dot::before,
.nav .dot::before{
  inset:-4px !important;
  border-color:rgba(95,255,137,.52) !important;
}
.brand .dot::after,
.nav .dot::after{
  inset:-7px !important;
  border-color:rgba(95,255,137,.36) !important;
  animation:statusRing28 .82s ease-out infinite !important;
}
@keyframes statusPulseRadar28{
  0%,100%{
    transform:scale(1);
    box-shadow:
      0 0 0 2px rgba(95,255,137,.18),
      0 0 18px rgba(95,255,137,1),
      0 0 30px rgba(95,255,137,.94),
      0 0 44px rgba(95,255,137,.24);
  }
  48%{
    transform:scale(1.14);
    box-shadow:
      0 0 0 2px rgba(95,255,137,.22),
      0 0 22px rgba(95,255,137,1),
      0 0 36px rgba(95,255,137,1),
      0 0 54px rgba(95,255,137,.32);
  }
}
@keyframes statusRing28{
  0%{opacity:.78;transform:scale(.42)}
  74%{opacity:0;transform:scale(1.58)}
  100%{opacity:0;transform:scale(1.82)}
}
html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#12bf57 !important;
}

@media (max-width:1180px){
  .hero.hero-portal{
    grid-template-columns:1fr !important;
  }
}
@media (max-width:780px){
  .about-summaries{
    grid-template-columns:1fr;
  }
}


/* v0.3.0 — shared hero shell + cleaned about + restored tab glitch */
.hero.hero-portal{
  display:block !important;
}
.hero-shell{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
  align-items:stretch;
}
.hero-pane{
  min-width:0;
  min-height:318px;
  padding:24px 24px 22px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(18,18,18,.86), rgba(13,13,13,.72));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
  overflow:hidden;
}
html.theme-light .hero-pane{
  background:linear-gradient(180deg, rgba(250,247,242,.94), rgba(245,240,232,.82));
}
.hero-pane--copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero-pane--signal{
  display:flex;
  flex-direction:column;
}
.hero-pane--signal .section-kicker{
  margin-bottom:12px;
}
.hero-pane--signal .logo-frame{
  flex:1;
  min-height:0;
  padding:18px;
}
.hero-pane--signal .logo-gif{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:236px;
  object-fit:contain;
}

.about-clean{
  display:grid;
  grid-template-columns:minmax(0, 1.04fr) minmax(0, .96fr);
  gap:18px;
  margin-top:18px;
}
.about-profile,
.about-core{
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(18,18,18,.86), rgba(13,13,13,.72));
  box-shadow:var(--shadow);
}
html.theme-light .about-profile,
html.theme-light .about-core{
  background:linear-gradient(180deg, rgba(250,247,242,.94), rgba(245,240,232,.82));
}
.about-profile{
  padding:22px 22px 20px;
}
.about-profile p{
  margin:0;
  color:var(--muted);
  line-height:1.85;
}
.tech-strip{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.tech-tag{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.02);
  color:var(--text);
  font-size:13px;
  letter-spacing:.04em;
}
html.theme-light .tech-tag{
  background:rgba(255,255,255,.56);
}
.about-core{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.about-row{
  min-width:0;
  padding:20px 20px 18px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.about-row:nth-child(2n){
  border-right:none;
}
.about-row:nth-last-child(-n+2){
  border-bottom:none;
}
.about-row strong{
  display:block;
  margin:8px 0 8px;
  font-size:clamp(16px,1.5vw,20px);
  line-height:1.2;
  color:var(--text);
}
.about-row p{
  margin:0;
  color:var(--muted);
  line-height:1.75;
}
.about-summaries,
.resume-grid{
  display:none !important;
}

/* restore visible tab glitch without ugly duplicated labels */
.menu a.glitch-nav{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  text-shadow:none !important;
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:"" !important;
  display:block !important;
  position:absolute;
  inset:-1px;
  pointer-events:none;
  opacity:0;
  border-radius:inherit;
}
.menu a.glitch-nav::before{
  background:linear-gradient(100deg, rgba(255,107,61,0) 0 24%, rgba(255,107,61,.24) 42%, rgba(255,184,110,.16) 52%, rgba(255,107,61,0) 64%);
  transform:translateX(-140%);
}
.menu a.glitch-nav::after{
  background:repeating-linear-gradient(to bottom, rgba(255,107,61,0) 0 9px, rgba(255,107,61,.12) 9px 11px, rgba(255,107,61,0) 11px 18px);
  mix-blend-mode:screen;
  transform:translateX(0);
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  color:var(--text) !important;
  text-shadow:1px 0 rgba(255,169,110,.34), -1px 0 rgba(255,107,61,.34), 0 0 12px rgba(255,107,61,.18) !important;
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:focus-visible::before,
.menu a.glitch-nav.active::before{
  opacity:1;
  animation:tabSweep209 .72s cubic-bezier(.22,.61,.36,1) both;
}
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav:focus-visible::after{
  opacity:.82;
  animation:tabNoise209 .72s steps(2,end) both;
}
.menu a.glitch-nav.active::after{
  opacity:.55;
  animation:tabIdle209 2.2s steps(2,end) infinite;
}
@keyframes tabSweep209{
  0%{transform:translateX(-140%)}
  58%{transform:translateX(18%)}
  100%{transform:translateX(140%);opacity:0}
}
@keyframes tabNoise209{
  0%,100%{clip-path:inset(0 0 0 0);transform:translateX(0)}
  18%{clip-path:inset(52% 0 24% 0);transform:translateX(1px)}
  36%{clip-path:inset(14% 0 66% 0);transform:translateX(-1px)}
  52%{clip-path:inset(68% 0 10% 0);transform:translateX(1px)}
  70%{clip-path:inset(30% 0 42% 0);transform:translateX(-1px)}
}
@keyframes tabIdle209{
  0%,86%,100%{clip-path:inset(0 0 0 0);transform:translateX(0)}
  88%{clip-path:inset(46% 0 28% 0);transform:translateX(1px)}
  90%{clip-path:inset(12% 0 70% 0);transform:translateX(-1px)}
  92%{clip-path:inset(64% 0 12% 0);transform:translateX(1px)}
}
html.theme-light .menu a.glitch-nav:hover,
html.theme-light .menu a.glitch-nav:focus-visible,
html.theme-light .menu a.glitch-nav.active{
  text-shadow:1px 0 rgba(217,120,60,.26), -1px 0 rgba(217,77,34,.22), 0 0 10px rgba(217,77,34,.10) !important;
}

@media (max-width:980px){
  .hero-shell,
  .about-clean{
    grid-template-columns:1fr;
  }
}
@media (max-width:720px){
  .about-core{
    grid-template-columns:1fr;
  }
  .about-row{
    border-right:none;
    border-bottom:1px solid var(--line);
  }
  .about-row:last-child{
    border-bottom:none;
  }
}


/* ============================================================
   v0.3.0 — compact shared hero, cleaner about, better tab glitch
   ============================================================ */
.hero.hero-portal{display:block !important;}
.hero-frame{
  padding:22px !important;
}
.hero-top{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:18px !important;
  align-items:stretch !important;
}
.hero-box{
  min-width:0;
  min-height:280px;
  padding:22px 22px 20px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(18,18,18,.88), rgba(12,12,12,.74));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
  overflow:hidden;
}
html.theme-light .hero-box{
  background:linear-gradient(180deg, rgba(250,247,242,.94), rgba(244,238,230,.84));
}
.hero-box--copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero-box--signal{
  display:flex;
  flex-direction:column;
}
.hero-box--signal .section-kicker{
  margin-bottom:12px;
}
.hero-box--signal .logo-frame{
  flex:1;
  min-height:0;
  padding:16px;
  border-radius:12px;
  display:grid;
  place-items:center;
}
.hero-box--signal .logo-gif{
  width:100%;
  height:auto;
  max-width:360px;
  max-height:205px;
  object-fit:contain;
}
.hero-box .subtitle{
  margin:8px 0 16px;
}
.hero-box .chips{
  margin-top:0;
}
.hero-box .chip{
  min-height:42px;
}

.about-clean{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:18px;
  margin-top:18px;
}
.about-profile,
.about-core{
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(18,18,18,.88), rgba(12,12,12,.74));
}
html.theme-light .about-profile,
html.theme-light .about-core{
  background:linear-gradient(180deg, rgba(250,247,242,.94), rgba(244,238,230,.84));
}
.about-profile{padding:22px;}
.about-profile p{margin:0; color:var(--muted); line-height:1.82;}
.tech-strip{margin-top:18px;}
.about-core{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.about-row{padding:20px;}
.about-row strong{margin:8px 0 6px;}
.about-row p{line-height:1.72;}

.menu a.glitch-nav{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  text-shadow:none !important;
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:"" !important;
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  pointer-events:none;
  opacity:0;
}
.menu a.glitch-nav::before{
  background:linear-gradient(100deg,
    rgba(255,107,61,0) 0 24%,
    rgba(255,107,61,.08) 34%,
    rgba(255,184,110,.36) 48%,
    rgba(255,107,61,.18) 56%,
    rgba(255,107,61,0) 68%);
  transform:translateX(-145%);
  mix-blend-mode:screen;
}
.menu a.glitch-nav::after{
  background:repeating-linear-gradient(to bottom,
    rgba(255,107,61,0) 0 7px,
    rgba(255,107,61,.12) 7px 9px,
    rgba(255,107,61,0) 9px 16px);
  clip-path:inset(0 0 100% 0);
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  color:var(--text) !important;
  text-shadow:
    0 0 10px rgba(255,132,94,.18),
    1px 0 0 rgba(255,184,110,.32),
    -1px 0 0 rgba(255,107,61,.22) !important;
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible{
  animation:navRetroJitter300 .34s steps(2,end) 1;
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:focus-visible::before,
.menu a.glitch-nav.active::before{
  opacity:1;
  animation:navRetroSweep300 .72s cubic-bezier(.22,.61,.36,1) both;
}
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav:focus-visible::after{
  opacity:.8;
  animation:navRetroScan300 .56s steps(2,end) both;
}
.menu a.glitch-nav.active::after{
  opacity:.52;
  animation:navRetroIdle300 2.6s steps(2,end) infinite;
}
@keyframes navRetroJitter300{
  0%{transform:translate(0,0)}
  25%{transform:translate(1px,-1px)}
  50%{transform:translate(-1px,1px)}
  75%{transform:translate(1px,0)}
  100%{transform:translate(0,0)}
}
@keyframes navRetroSweep300{
  0%{transform:translateX(-145%)}
  58%{transform:translateX(12%)}
  100%{transform:translateX(145%);opacity:0}
}
@keyframes navRetroScan300{
  0%{clip-path:inset(0 0 100% 0);transform:translateX(0)}
  18%{clip-path:inset(8% 0 74% 0);transform:translateX(1px)}
  40%{clip-path:inset(50% 0 26% 0);transform:translateX(-1px)}
  62%{clip-path:inset(70% 0 8% 0);transform:translateX(1px)}
  100%{clip-path:inset(0 0 0 0);opacity:0}
}
@keyframes navRetroIdle300{
  0%,84%,100%{clip-path:inset(0 0 100% 0);transform:translateX(0)}
  88%{clip-path:inset(14% 0 70% 0);transform:translateX(1px)}
  91%{clip-path:inset(54% 0 24% 0);transform:translateX(-1px)}
  94%{clip-path:inset(76% 0 6% 0);transform:translateX(1px)}
}
html.theme-light .menu a.glitch-nav:hover,
html.theme-light .menu a.glitch-nav:focus-visible,
html.theme-light .menu a.glitch-nav.active{
  text-shadow:
    0 0 8px rgba(217,77,34,.14),
    1px 0 0 rgba(230,130,78,.22),
    -1px 0 0 rgba(217,77,34,.18) !important;
}
html.theme-light .menu a.glitch-nav::before{
  background:linear-gradient(100deg,
    rgba(217,77,34,0) 0 24%,
    rgba(217,77,34,.08) 34%,
    rgba(236,106,66,.28) 48%,
    rgba(217,77,34,.14) 56%,
    rgba(217,77,34,0) 68%);
}
html.theme-light .menu a.glitch-nav::after{
  background:repeating-linear-gradient(to bottom,
    rgba(217,77,34,0) 0 7px,
    rgba(217,77,34,.10) 7px 9px,
    rgba(217,77,34,0) 9px 16px);
}

.nav .dot{
  width:8px !important;
  height:8px !important;
  border-radius:999px;
  background:#49ff88 !important;
  box-shadow:
    0 0 0 2px rgba(73,255,136,.15),
    0 0 12px rgba(73,255,136,.85),
    0 0 22px rgba(73,255,136,.52) !important;
}
.nav .dot::before,
.nav .dot::after{
  content:"";
  position:absolute;
  inset:50% auto auto 50%;
  transform:translate(-50%,-50%);
  border-radius:999px;
  pointer-events:none;
}
.nav .dot::before{
  width:16px;
  height:16px;
  background:radial-gradient(circle, rgba(73,255,136,.34) 0%, rgba(73,255,136,0) 70%);
  animation:statusCore300 1.4s ease-in-out infinite;
}
.nav .dot::after{
  width:10px;
  height:10px;
  border:1px solid rgba(73,255,136,.42);
  animation:statusRadar300 1.35s ease-out infinite;
}
@keyframes statusCore300{
  0%,100%{opacity:.58; transform:translate(-50%,-50%) scale(1)}
  50%{opacity:1; transform:translate(-50%,-50%) scale(1.16)}
}
@keyframes statusRadar300{
  0%{opacity:.75; transform:translate(-50%,-50%) scale(1)}
  80%{opacity:0; transform:translate(-50%,-50%) scale(2.55)}
  100%{opacity:0; transform:translate(-50%,-50%) scale(2.7)}
}
html.theme-light .nav .dot{
  background:#22d45d !important;
  box-shadow:
    0 0 0 2px rgba(34,212,93,.14),
    0 0 10px rgba(34,212,93,.58),
    0 0 18px rgba(34,212,93,.32) !important;
}
html.theme-light .nav .dot::before{
  background:radial-gradient(circle, rgba(34,212,93,.22) 0%, rgba(34,212,93,0) 70%);
}
html.theme-light .nav .dot::after{
  border-color:rgba(34,212,93,.30);
}

@media (max-width:980px){
  .hero-top,
  .about-clean{
    grid-template-columns:1fr !important;
  }
  .hero-box{
    min-height:auto;
  }
  .hero-box--signal .logo-frame{
    min-height:220px;
  }
}
@media (max-width:720px){
  .about-core,
  .module-grid{
    grid-template-columns:1fr !important;
  }
  .about-row{
    border-right:none !important;
    border-bottom:1px solid var(--line) !important;
  }
  .about-row:last-child{
    border-bottom:none !important;
  }
}


/* ============================================================
   v0.3.1 patch: cleaner tab glitch + fixed green status lamp
   ============================================================ */
.nav,
.topbar,
.brand,
.brand .dot,
.nav .dot{
  overflow: visible;
}

.brand .dot,
.nav .dot{
  position: relative !important;
  display: inline-block !important;
  flex: 0 0 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  aspect-ratio: 1 / 1;
  background: #39ff7a !important;
  transform: translateZ(0);
  box-shadow:
    0 0 0 1px rgba(57,255,122,.22),
    0 0 10px rgba(57,255,122,.95),
    0 0 20px rgba(57,255,122,.52) !important;
  animation: none !important;
}
.brand .dot::before,
.brand .dot::after,
.nav .dot::before,
.nav .dot::after{
  content:"";
  position:absolute;
  inset:50% auto auto 50%;
  transform:translate(-50%,-50%);
  border-radius:999px;
  pointer-events:none;
}
.brand .dot::before,
.nav .dot::before{
  width: 18px;
  height: 18px;
  background: radial-gradient(circle, rgba(57,255,122,.34) 0%, rgba(57,255,122,.12) 38%, rgba(57,255,122,0) 72%);
  animation: statusCore301 1.15s ease-in-out infinite;
}
.brand .dot::after,
.nav .dot::after{
  width: 12px;
  height: 12px;
  border: 1px solid rgba(57,255,122,.46);
  animation: statusRadar301 1.2s cubic-bezier(.2,.7,.25,1) infinite;
}
@keyframes statusCore301{
  0%,100%{opacity:.72; transform:translate(-50%,-50%) scale(1)}
  50%{opacity:1; transform:translate(-50%,-50%) scale(1.14)}
}
@keyframes statusRadar301{
  0%{opacity:.88; transform:translate(-50%,-50%) scale(.82)}
  78%{opacity:0; transform:translate(-50%,-50%) scale(2.15)}
  100%{opacity:0; transform:translate(-50%,-50%) scale(2.28)}
}
html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#24d764 !important;
  box-shadow:
    0 0 0 1px rgba(36,215,100,.18),
    0 0 9px rgba(36,215,100,.62),
    0 0 16px rgba(36,215,100,.34) !important;
}
html.theme-light .brand .dot::before,
html.theme-light .nav .dot::before{
  background: radial-gradient(circle, rgba(36,215,100,.24) 0%, rgba(36,215,100,.08) 38%, rgba(36,215,100,0) 72%);
}
html.theme-light .brand .dot::after,
html.theme-light .nav .dot::after{
  border-color: rgba(36,215,100,.28);
}

.menu a.glitch-nav{
  position: relative !important;
  overflow: hidden;
  isolation: isolate;
  text-shadow: none !important;
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content: attr(data-text) !important;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: inherit;
  pointer-events: none;
  opacity: 0;
  color: var(--accent-strong);
  background: transparent !important;
  transform: translate3d(0,0,0);
}
.menu a.glitch-nav::before{
  text-shadow: 1px 0 0 rgba(120,227,255,.72);
  clip-path: inset(0 0 56% 0);
}
.menu a.glitch-nav::after{
  text-shadow: -1px 0 0 rgba(255,107,61,.88);
  clip-path: inset(58% 0 0 0);
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  color: var(--text) !important;
  text-shadow:
    0 0 8px rgba(255,132,94,.16),
    .8px 0 0 rgba(120,227,255,.24),
    -.8px 0 0 rgba(255,107,61,.22) !important;
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible{
  animation: navTextJitter301 .34s steps(2,end) 1;
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:focus-visible::before{
  opacity: .82;
  animation: navSliceTop301 .46s steps(2,end) both;
}
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav:focus-visible::after{
  opacity: .78;
  animation: navSliceBot301 .46s steps(2,end) both;
}
.menu a.glitch-nav.active{
  animation: navActiveJitter301 3.1s steps(2,end) infinite;
}
.menu a.glitch-nav.active::before{
  opacity: .42;
  animation: navSliceTopIdle301 3.1s steps(2,end) infinite;
}
.menu a.glitch-nav.active::after{
  opacity: .34;
  animation: navSliceBotIdle301 3.1s steps(2,end) infinite;
}
@keyframes navTextJitter301{
  0%{transform:translate(0,0)}
  25%{transform:translate(1px,-1px)}
  50%{transform:translate(-1px,1px)}
  75%{transform:translate(1px,0)}
  100%{transform:translate(0,0)}
}
@keyframes navSliceTop301{
  0%{opacity:0; transform:translate3d(0,0,0); clip-path: inset(0 0 56% 0)}
  20%{opacity:.9; transform:translate3d(1px,-1px,0); clip-path: inset(4% 0 52% 0)}
  50%{opacity:.7; transform:translate3d(-1px,1px,0); clip-path: inset(12% 0 43% 0)}
  100%{opacity:0; transform:translate3d(0,0,0); clip-path: inset(0 0 56% 0)}
}
@keyframes navSliceBot301{
  0%{opacity:0; transform:translate3d(0,0,0); clip-path: inset(58% 0 0 0)}
  20%{opacity:.86; transform:translate3d(-1px,1px,0); clip-path: inset(60% 0 2% 0)}
  50%{opacity:.68; transform:translate3d(1px,-1px,0); clip-path: inset(55% 0 7% 0)}
  100%{opacity:0; transform:translate3d(0,0,0); clip-path: inset(58% 0 0 0)}
}
@keyframes navActiveJitter301{
  0%,86%,100%{transform:translate(0,0)}
  88%{transform:translate(1px,-1px)}
  91%{transform:translate(-1px,1px)}
  94%{transform:translate(1px,0)}
}
@keyframes navSliceTopIdle301{
  0%,84%,100%{opacity:0; transform:translate3d(0,0,0); clip-path: inset(0 0 56% 0)}
  87%{opacity:.42; transform:translate3d(1px,-1px,0); clip-path: inset(5% 0 48% 0)}
  92%{opacity:.32; transform:translate3d(-1px,0,0); clip-path: inset(10% 0 43% 0)}
}
@keyframes navSliceBotIdle301{
  0%,84%,100%{opacity:0; transform:translate3d(0,0,0); clip-path: inset(58% 0 0 0)}
  88%{opacity:.34; transform:translate3d(-1px,1px,0); clip-path: inset(60% 0 2% 0)}
  93%{opacity:.26; transform:translate3d(1px,0,0); clip-path: inset(55% 0 6% 0)}
}
html.theme-light .menu a.glitch-nav:hover,
html.theme-light .menu a.glitch-nav:focus-visible,
html.theme-light .menu a.glitch-nav.active{
  text-shadow:
    0 0 7px rgba(217,77,34,.12),
    .8px 0 0 rgba(26,135,165,.18),
    -.8px 0 0 rgba(217,77,34,.20) !important;
}
html.theme-light .menu a.glitch-nav::before{
  color: #d94d22;
  text-shadow: 1px 0 0 rgba(26,135,165,.56);
}
html.theme-light .menu a.glitch-nav::after{
  color: #ec6a42;
  text-shadow: -1px 0 0 rgba(217,77,34,.50);
}


/* ============================================================
   v0.3.2 patch: stronger nav glitch + clean radar lamp + retro radii
   ============================================================ */
:root{
  --radius:16px;
  --radius-sm:10px;
}

.nav,
.topbar,
.hero-frame,
.hero-box,
.logo-frame,
.panel,
.panel-body,
.about-panel,
.about-row,
.module-card,
.card,
.module-list a,
.btn,
.theme-toggle,
.menu a,
.chip,
.info-chip,
.quick-command,
.mobile-actions,
.resume-grid > *,
.info-grid > *,
.card-grid > *{
  border-radius:12px !important;
}

.portal-panel,
.section-block,
.terminal-shell,
.term-aside,
.term-main{
  border-radius:14px !important;
}

.menu a.glitch-nav,
.brand-name.glitch-lite{
  overflow:visible !important;
  isolation:isolate;
}
.menu a.glitch-nav .nav-label,
.brand-name.glitch-lite .brand-label{
  position:relative;
  z-index:3;
  display:inline-block;
}
.menu a.glitch-nav{
  font-weight:600;
  letter-spacing:.02em;
  text-shadow:0 0 0 rgba(0,0,0,0);
  animation:navIdleGlow302 4.6s ease-in-out infinite;
}
.menu a.glitch-nav:nth-child(odd){ animation-delay:.7s; }
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:attr(data-text) !important;
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  white-space:nowrap;
  opacity:0;
  border-radius:inherit;
  will-change:transform,opacity,clip-path;
}
.menu a.glitch-nav::before{
  color:rgba(120,227,255,.95);
  text-shadow:0 0 14px rgba(120,227,255,.36), 1.6px 0 0 rgba(120,227,255,.82);
  clip-path:inset(0 0 54% 0);
}
.menu a.glitch-nav::after{
  color:rgba(255,132,94,.98);
  text-shadow:0 0 14px rgba(255,107,61,.30), -1.6px 0 0 rgba(255,107,61,.92);
  clip-path:inset(58% 0 0 0);
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  color:var(--text) !important;
  text-shadow:
    0 0 11px rgba(255,132,94,.26),
    1.2px 0 0 rgba(120,227,255,.34),
    -1.2px 0 0 rgba(255,107,61,.32) !important;
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible{
  animation:navHoverJitter302 .56s steps(2,end) infinite;
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:focus-visible::before{
  opacity:.92;
  animation:navSliceTop302 .48s steps(2,end) infinite;
}
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav:focus-visible::after{
  opacity:.86;
  animation:navSliceBot302 .48s steps(2,end) infinite;
}
.menu a.glitch-nav.active{
  animation:navActiveJitter302 2.8s steps(2,end) infinite;
}
.menu a.glitch-nav.active::before{
  opacity:.58;
  animation:navSliceTop302 2.8s steps(2,end) infinite;
}
.menu a.glitch-nav.active::after{
  opacity:.52;
  animation:navSliceBot302 2.8s steps(2,end) infinite .08s;
}
@keyframes navIdleGlow302{
  0%,100%{text-shadow:0 0 0 rgba(0,0,0,0)}
  46%{text-shadow:0 0 9px rgba(255,132,94,.08)}
  48%{text-shadow:0 0 10px rgba(255,132,94,.14), .8px 0 0 rgba(120,227,255,.10), -.8px 0 0 rgba(255,107,61,.10)}
  50%{text-shadow:0 0 0 rgba(0,0,0,0)}
}
@keyframes navHoverJitter302{
  0%,100%{transform:translate3d(0,0,0)}
  20%{transform:translate3d(1px,-1px,0)}
  40%{transform:translate3d(-1px,1px,0)}
  60%{transform:translate3d(1px,0,0)}
  80%{transform:translate3d(-1px,0,0)}
}
@keyframes navActiveJitter302{
  0%,72%,100%{transform:translate3d(0,0,0)}
  76%{transform:translate3d(1px,-1px,0)}
  80%{transform:translate3d(-1px,1px,0)}
  84%{transform:translate3d(1px,0,0)}
  88%{transform:translate3d(-1px,0,0)}
}
@keyframes navSliceTop302{
  0%,100%{opacity:0; transform:translate3d(0,0,0); clip-path:inset(0 0 54% 0)}
  10%{opacity:.94; transform:translate3d(1px,-1px,0); clip-path:inset(4% 0 50% 0)}
  28%{opacity:.72; transform:translate3d(-1px,1px,0); clip-path:inset(12% 0 42% 0)}
  44%{opacity:.84; transform:translate3d(2px,0,0); clip-path:inset(2% 0 56% 0)}
  62%{opacity:.66; transform:translate3d(-1px,-1px,0); clip-path:inset(9% 0 45% 0)}
}
@keyframes navSliceBot302{
  0%,100%{opacity:0; transform:translate3d(0,0,0); clip-path:inset(58% 0 0 0)}
  12%{opacity:.90; transform:translate3d(-1px,1px,0); clip-path:inset(60% 0 2% 0)}
  30%{opacity:.70; transform:translate3d(1px,-1px,0); clip-path:inset(55% 0 7% 0)}
  46%{opacity:.82; transform:translate3d(-2px,0,0); clip-path:inset(62% 0 0 0)}
  64%{opacity:.60; transform:translate3d(1px,1px,0); clip-path:inset(57% 0 5% 0)}
}

.brand,
.brand .dot,
.nav .dot{
  overflow:visible !important;
}
.brand .dot,
.nav .dot{
  position:relative !important;
  display:inline-block !important;
  flex:0 0 8px !important;
  width:8px !important;
  height:8px !important;
  min-width:8px !important;
  min-height:8px !important;
  border-radius:50% !important;
  aspect-ratio:1 / 1;
  background:#43ff88 !important;
  box-shadow:
    0 0 0 1px rgba(67,255,136,.30),
    0 0 10px rgba(67,255,136,.98),
    0 0 18px rgba(67,255,136,.68),
    0 0 28px rgba(67,255,136,.28) !important;
  transform:translateZ(0);
  animation:none !important;
}
.brand .dot::before,
.brand .dot::after,
.nav .dot::before,
.nav .dot::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  pointer-events:none;
}
.brand .dot::before,
.nav .dot::before{
  width:24px;
  height:24px;
  background:radial-gradient(circle, rgba(67,255,136,.34) 0%, rgba(67,255,136,.14) 38%, rgba(67,255,136,0) 72%);
  animation:dotHalo302 1.22s ease-in-out infinite;
}
.brand .dot::after,
.nav .dot::after{
  width:10px;
  height:10px;
  background:transparent;
  border:1.5px solid rgba(67,255,136,.66);
  box-shadow:0 0 10px rgba(67,255,136,.26);
  animation:dotRadar302 1.22s cubic-bezier(.18,.70,.25,1) infinite;
}
@keyframes dotHalo302{
  0%,100%{opacity:.72; transform:translate(-50%,-50%) scale(.92)}
  50%{opacity:1; transform:translate(-50%,-50%) scale(1.14)}
}
@keyframes dotRadar302{
  0%{opacity:.95; transform:translate(-50%,-50%) scale(1)}
  78%{opacity:0; transform:translate(-50%,-50%) scale(2.95)}
  100%{opacity:0; transform:translate(-50%,-50%) scale(3.08)}
}

html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#21db63 !important;
  box-shadow:
    0 0 0 1px rgba(33,219,99,.22),
    0 0 9px rgba(33,219,99,.78),
    0 0 16px rgba(33,219,99,.42),
    0 0 24px rgba(33,219,99,.16) !important;
}
html.theme-light .brand .dot::before,
html.theme-light .nav .dot::before{
  background:radial-gradient(circle, rgba(33,219,99,.24) 0%, rgba(33,219,99,.08) 38%, rgba(33,219,99,0) 72%);
}
html.theme-light .brand .dot::after,
html.theme-light .nav .dot::after{
  border-color:rgba(33,219,99,.34);
  box-shadow:0 0 8px rgba(33,219,99,.14);
}

html.theme-light .menu a.glitch-nav:hover,
html.theme-light .menu a.glitch-nav:focus-visible,
html.theme-light .menu a.glitch-nav.active{
  text-shadow:
    0 0 8px rgba(217,77,34,.16),
    1px 0 0 rgba(26,135,165,.22),
    -1px 0 0 rgba(217,77,34,.22) !important;
}
html.theme-light .menu a.glitch-nav::before{
  color:#1a87a5;
  text-shadow:0 0 12px rgba(26,135,165,.16), 1.4px 0 0 rgba(26,135,165,.54);
}
html.theme-light .menu a.glitch-nav::after{
  color:#d94d22;
  text-shadow:0 0 12px rgba(217,77,34,.14), -1.4px 0 0 rgba(217,77,34,.54);
}

/* v0.3.3 patch: rebuild live status lamp + hard-rectangle retro panels */
:root{
  --radius: 8px;
  --radius-sm: 4px;
}

.nav,
.portal-panel,
.hero-frame,
.hero-box,
.section-block,
.about-panel,
.module-card,
.menu a,
.chip,
.btn,
.btn-ghost,
.theme-toggle,
.logo-frame,
.about-row,
.tech-tag,
.panel-body,
.resume-shell,
.project-card,
.howto-card,
.footer,
.card,
.window,
input,
textarea,
select{
  border-radius: 6px !important;
}

.module-grid,
.about-clean,
.hero-top,
.resume-grid,
.project-grid,
.howto-grid{
  gap: 16px;
}

.brand,
.brand .dot,
.nav .dot{
  overflow: visible !important;
}

.brand .dot,
.nav .dot{
  position: relative !important;
  display: inline-block !important;
  flex: 0 0 9px !important;
  width: 9px !important;
  height: 9px !important;
  min-width: 9px !important;
  min-height: 9px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 999px !important;
  background: #52ff8e !important;
  background-image: none !important;
  transform: none !important;
  filter: none !important;
  animation: statusPulse303 1.4s ease-in-out infinite !important;
  box-shadow:
    0 0 0 1px rgba(82,255,142,.32),
    0 0 10px rgba(82,255,142,.95),
    0 0 20px rgba(82,255,142,.78),
    0 0 34px rgba(82,255,142,.42) !important;
}

.brand .dot::before,
.brand .dot::after,
.nav .dot::before,
.nav .dot::after{
  content: none !important;
  display: none !important;
}

@keyframes statusPulse303{
  0%,100%{
    opacity: .9;
    box-shadow:
      0 0 0 1px rgba(82,255,142,.28),
      0 0 8px rgba(82,255,142,.88),
      0 0 16px rgba(82,255,142,.64),
      0 0 26px rgba(82,255,142,.26);
  }
  50%{
    opacity: 1;
    box-shadow:
      0 0 0 1px rgba(82,255,142,.34),
      0 0 12px rgba(82,255,142,1),
      0 0 24px rgba(82,255,142,.9),
      0 0 38px rgba(82,255,142,.5);
  }
}

html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background: #21db63 !important;
  animation: statusPulse303Light 1.4s ease-in-out infinite !important;
  box-shadow:
    0 0 0 1px rgba(33,219,99,.24),
    0 0 9px rgba(33,219,99,.72),
    0 0 18px rgba(33,219,99,.48),
    0 0 28px rgba(33,219,99,.22) !important;
}

@keyframes statusPulse303Light{
  0%,100%{
    opacity: .9;
    box-shadow:
      0 0 0 1px rgba(33,219,99,.22),
      0 0 8px rgba(33,219,99,.62),
      0 0 14px rgba(33,219,99,.36),
      0 0 22px rgba(33,219,99,.16);
  }
  50%{
    opacity: 1;
    box-shadow:
      0 0 0 1px rgba(33,219,99,.26),
      0 0 10px rgba(33,219,99,.78),
      0 0 18px rgba(33,219,99,.48),
      0 0 28px rgba(33,219,99,.2);
  }
}


/* ============================================================
   v0.3.5 — Zerobyte-inspired retro portal refinement
   Keeps functionality intact; final visual override only.
   ============================================================ */
:root{
  --radius: 3px;
  --radius-sm: 2px;
  --retro-bg-1: rgba(13,13,13,.96);
  --retro-bg-2: rgba(7,7,7,.90);
  --retro-edge: rgba(255,164,94,.18);
  --retro-edge-strong: rgba(255,182,114,.34);
  --retro-green: #56ff87;
  --retro-amber: #ff9d58;
  --retro-amber-strong: #ffbf84;
  --retro-text: #f2efe6;
  --retro-muted: #b3ab9d;
}

html,
body{
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.18;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0) 28%),
    repeating-linear-gradient(to bottom, rgba(255,255,255,.022) 0 1px, transparent 1px 4px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px);
  background-size: auto, auto, 36px 36px, 36px 36px;
}
.page{position:relative; z-index:1;}

h1,h2,h3,.brand-name,.menu a,.panel-kicker,.section-kicker,.module-title,.btn{
  font-family: "Share Tech Mono", "IBM Plex Mono", ui-monospace, monospace !important;
}

h1,h2,h3,
.brand-name,
.module-title{
  letter-spacing:.04em;
  text-transform:uppercase;
}

.subtitle,
p,
li,
.muted,
.module-card p,
.about-profile p,
.about-row p{
  color:var(--retro-text);
}

.muted,
.module-card p,
.about-profile p,
.about-row p,
.footer,
.chip,
.tech-tag{
  color:var(--retro-muted) !important;
}

.page,
.portal-home,
.shell,
.portal-page{
  position:relative;
}

.nav,
.topbar,
.portal-panel,
.about-panel,
.card,
.resume-grid > .card,
.module-card,
.video-embed,
.footer,
.mobile-actions,
.hero-box,
.about-profile,
.about-core,
.about-row,
.logo-frame,
.btn,
.theme-toggle,
.chip,
.tech-tag,
.info-chip,
.quick-command,
.module-list a{
  border-radius:var(--radius) !important;
  border:1px solid var(--retro-edge) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, var(--retro-bg-1), var(--retro-bg-2)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 0 0 1px rgba(0,0,0,.65),
    0 18px 40px rgba(0,0,0,.34) !important;
}

.hero-frame,
.hero-box,
.about-profile,
.about-core,
.about-row,
.module-card,
.card,
.logo-frame,
.video-embed{
  position:relative;
}

.hero-frame::before,
.hero-box::before,
.about-profile::before,
.about-core::before,
.module-card::before,
.card::before,
.logo-frame::before,
.video-embed::before{
  content:"";
  position:absolute;
  top:-1px;
  left:-1px;
  width:18px;
  height:18px;
  border-top:1px solid rgba(255,191,132,.58);
  border-left:1px solid rgba(255,191,132,.58);
  pointer-events:none;
}

.hero-frame::after,
.hero-box::after,
.about-profile::after,
.about-core::after,
.module-card::after,
.card::after,
.logo-frame::after,
.video-embed::after{
  content:"";
  position:absolute;
  right:-1px;
  bottom:-1px;
  width:18px;
  height:18px;
  border-right:1px solid rgba(255,191,132,.34);
  border-bottom:1px solid rgba(255,191,132,.34);
  pointer-events:none;
}

.hero-frame,
.about-panel{
  padding:20px !important;
}

.hero-top,
.about-clean,
.module-grid,
.resume-grid,
.howto-grid{
  gap:14px !important;
}

.hero-box,
.about-profile,
.about-row,
.module-card,
.card{
  padding:18px !important;
}

.logo-frame{
  min-height:250px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.014), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, rgba(8,8,8,.96), rgba(4,4,4,.92)),
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px) !important;
  background-size:auto, auto, 18px 18px, 18px 18px !important;
  border-color:rgba(255,176,106,.22) !important;
}
.logo-gif{
  filter:contrast(1.04) saturate(.92);
}

.panel-kicker,
.section-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:11px !important;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--retro-green) !important;
}
.panel-kicker::before,
.section-kicker::before{
  content:"//";
  color:rgba(86,255,135,.68);
}

.hero-glitch,
.brand-name.glitch-lite,
.menu a.glitch-nav{
  text-transform:uppercase;
}

.hero-glitch{
  color:var(--retro-text) !important;
  text-shadow:0 0 14px rgba(255,157,88,.08), 0 0 1px rgba(255,255,255,.2) !important;
}

.menu{
  gap:8px !important;
}

.menu a{
  min-height:38px;
  padding:10px 14px !important;
  border-radius:var(--radius) !important;
  border:1px solid rgba(255,166,96,.16) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, rgba(13,13,13,.98), rgba(8,8,8,.92)) !important;
  color:var(--retro-muted) !important;
  font-size:12px;
  font-weight:400;
  letter-spacing:.14em;
  text-transform:uppercase;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 1px rgba(0,0,0,.66) !important;
}
.menu a:hover,
.menu a:focus-visible,
.menu a.active{
  color:var(--retro-text) !important;
  border-color:var(--retro-edge-strong) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 0 1px rgba(255,169,98,.16),
    0 0 20px rgba(255,157,88,.10) !important;
}
.menu a.glitch-nav{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  animation:none !important;
}
.menu a.glitch-nav .nav-label,
.brand-name.glitch-lite .brand-label{
  position:relative;
  z-index:2;
}
.menu a.glitch-nav::before,
.menu a.glitch-nav::after{
  content:attr(data-text) !important;
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  white-space:nowrap;
  pointer-events:none;
  opacity:0;
}
.menu a.glitch-nav::before{
  color:rgba(255,188,130,.94);
  text-shadow:1px 0 0 rgba(255,157,88,.84), 0 0 12px rgba(255,157,88,.22);
  clip-path:inset(0 0 58% 0);
}
.menu a.glitch-nav::after{
  color:rgba(86,255,135,.84);
  text-shadow:-1px 0 0 rgba(86,255,135,.68), 0 0 12px rgba(86,255,135,.14);
  clip-path:inset(58% 0 0 0);
}
.menu a.glitch-nav:hover,
.menu a.glitch-nav:focus-visible,
.menu a.glitch-nav.active{
  text-shadow:
    1px 0 0 rgba(255,188,130,.20),
    -1px 0 0 rgba(86,255,135,.16),
    0 0 16px rgba(255,157,88,.10) !important;
}
.menu a.glitch-nav:hover::before,
.menu a.glitch-nav:focus-visible::before,
.menu a.glitch-nav.active::before{
  opacity:.9;
  animation:oxTabSliceTop305 .34s steps(2,end) infinite;
}
.menu a.glitch-nav:hover::after,
.menu a.glitch-nav:focus-visible::after,
.menu a.glitch-nav.active::after{
  opacity:.72;
  animation:oxTabSliceBottom305 .34s steps(2,end) infinite;
}

@keyframes oxTabSliceTop305{
  0%,100%{transform:translate3d(0,0,0); clip-path:inset(0 0 58% 0)}
  20%{transform:translate3d(1px,-1px,0); clip-path:inset(4% 0 49% 0)}
  45%{transform:translate3d(-1px,1px,0); clip-path:inset(10% 0 43% 0)}
  70%{transform:translate3d(1px,0,0); clip-path:inset(2% 0 55% 0)}
}
@keyframes oxTabSliceBottom305{
  0%,100%{transform:translate3d(0,0,0); clip-path:inset(58% 0 0 0)}
  24%{transform:translate3d(-1px,1px,0); clip-path:inset(60% 0 3% 0)}
  48%{transform:translate3d(1px,-1px,0); clip-path:inset(54% 0 7% 0)}
  72%{transform:translate3d(-1px,0,0); clip-path:inset(62% 0 0 0)}
}

.brand,
.nav,
.topbar{
  border-color:rgba(255,164,94,.20) !important;
}
.brand .dot,
.nav .dot{
  position:relative !important;
  display:inline-block !important;
  flex:0 0 8px !important;
  width:8px !important;
  height:8px !important;
  min-width:8px !important;
  min-height:8px !important;
  border-radius:999px !important;
  background:var(--retro-green) !important;
  box-shadow:
    0 0 0 1px rgba(86,255,135,.22),
    0 0 9px rgba(86,255,135,.94),
    0 0 18px rgba(86,255,135,.56) !important;
  animation:oxLiveDot305 1.5s ease-in-out infinite !important;
}
.brand .dot::before,
.brand .dot::after,
.nav .dot::before,
.nav .dot::after{
  content:none !important;
  display:none !important;
}
@keyframes oxLiveDot305{
  0%,100%{
    transform:scale(1);
    box-shadow:
      0 0 0 1px rgba(86,255,135,.20),
      0 0 8px rgba(86,255,135,.90),
      0 0 16px rgba(86,255,135,.48) !important;
  }
  50%{
    transform:scale(1.06);
    box-shadow:
      0 0 0 1px rgba(86,255,135,.24),
      0 0 10px rgba(86,255,135,1),
      0 0 20px rgba(86,255,135,.60) !important;
  }
}

.brand-name.glitch-lite{
  letter-spacing:.14em;
  color:var(--retro-text) !important;
}

.chips,
.tech-strip{
  gap:8px !important;
}
.chip,
.tech-tag,
.info-chip,
.quick-command,
.module-list a{
  padding:8px 10px !important;
  border-radius:var(--radius) !important;
  border-color:rgba(255,164,94,.15) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, rgba(15,15,15,.96), rgba(9,9,9,.90)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 0 0 1px rgba(0,0,0,.66) !important;
}

.btn,
.theme-toggle{
  min-height:40px;
  padding:10px 14px !important;
  border-color:rgba(255,164,94,.16) !important;
}
.btn:hover,
.btn:focus-visible,
.theme-toggle:hover,
.theme-toggle:focus-visible{
  border-color:var(--retro-edge-strong) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 0 1px rgba(255,169,98,.14),
    0 0 16px rgba(255,157,88,.10) !important;
}

.module-card,
.card,
.about-row{
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.module-card:hover,
.card:hover,
.about-row:hover{
  transform:translateY(-2px);
  border-color:rgba(255,182,114,.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 0 1px rgba(255,176,106,.12),
    0 22px 44px rgba(0,0,0,.38) !important;
}

.module-title,
.card h2,
.about-row strong{
  color:var(--retro-text) !important;
}
.module-title{
  font-size:20px !important;
  letter-spacing:.08em;
}
.card h2,
.about-panel h2,
.section-heading h2{
  font-size:clamp(22px, 2vw, 30px) !important;
  letter-spacing:.08em;
}
.about-row strong{
  display:block;
  font-size:18px;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.footer{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
}

.video-embed,
.video-embed iframe{
  border-radius:var(--radius) !important;
}
.video-embed iframe{
  border:none;
}

hr.soft{
  border:none;
  border-top:1px solid rgba(255,164,94,.16);
}

html.theme-light body::before{
  opacity:.10;
}
html.theme-light .nav,
html.theme-light .topbar,
html.theme-light .portal-panel,
html.theme-light .about-panel,
html.theme-light .card,
html.theme-light .resume-grid > .card,
html.theme-light .module-card,
html.theme-light .video-embed,
html.theme-light .footer,
html.theme-light .mobile-actions,
html.theme-light .hero-box,
html.theme-light .about-profile,
html.theme-light .about-core,
html.theme-light .about-row,
html.theme-light .logo-frame,
html.theme-light .btn,
html.theme-light .theme-toggle,
html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .info-chip,
html.theme-light .quick-command,
html.theme-light .module-list a{
  background:
    linear-gradient(180deg, rgba(255,255,255,.54), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, rgba(250,246,238,.98), rgba(241,234,223,.94)) !important;
  border-color:rgba(191,107,66,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    0 0 0 1px rgba(83,53,34,.05),
    0 18px 34px rgba(100,76,57,.10) !important;
}
html.theme-light .menu a{
  background:
    linear-gradient(180deg, rgba(255,255,255,.58), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, rgba(250,246,238,.98), rgba(241,234,223,.94)) !important;
  color:#6c6458 !important;
  border-color:rgba(191,107,66,.16) !important;
}
html.theme-light .menu a:hover,
html.theme-light .menu a:focus-visible,
html.theme-light .menu a.active,
html.theme-light .btn:hover,
html.theme-light .btn:focus-visible,
html.theme-light .theme-toggle:hover,
html.theme-light .theme-toggle:focus-visible{
  border-color:rgba(191,107,66,.32) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.65),
    0 0 0 1px rgba(191,107,66,.10),
    0 0 14px rgba(191,107,66,.08) !important;
}
html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#19cf63 !important;
  box-shadow:
    0 0 0 1px rgba(25,207,99,.18),
    0 0 8px rgba(25,207,99,.58),
    0 0 16px rgba(25,207,99,.28) !important;
}
html.theme-light .panel-kicker,
html.theme-light .section-kicker{
  color:#149951 !important;
}

@media (max-width: 920px){
  .menu a{
    font-size:11px;
    letter-spacing:.12em;
  }
}

@media (max-width: 720px){
  .hero-frame,
  .about-panel,
  .hero-box,
  .about-profile,
  .about-row,
  .module-card,
  .card{
    padding:16px !important;
  }
  .logo-frame{
    min-height:210px;
  }
}


/* ============================================================
   v0.3.7 — mobile header placement + brighter live pulse
   Final override for phone-ready nav and stronger status glow.
   ============================================================ */
.brand .dot,
.nav .dot{
  flex:0 0 10px !important;
  width:10px !important;
  height:10px !important;
  min-width:10px !important;
  min-height:10px !important;
  background:#63ff95 !important;
  animation:oxLiveDot307 1.12s ease-in-out infinite !important;
  box-shadow:
    0 0 0 1px rgba(99,255,149,.30),
    0 0 10px rgba(99,255,149,.98),
    0 0 20px rgba(99,255,149,.88),
    0 0 34px rgba(99,255,149,.52),
    0 0 52px rgba(99,255,149,.18) !important;
}

@keyframes oxLiveDot307{
  0%,100%{
    opacity:.82;
    transform:scale(1);
    box-shadow:
      0 0 0 1px rgba(99,255,149,.24),
      0 0 8px rgba(99,255,149,.78),
      0 0 16px rgba(99,255,149,.58),
      0 0 28px rgba(99,255,149,.28),
      0 0 42px rgba(99,255,149,.10) !important;
  }
  50%{
    opacity:1;
    transform:scale(1.08);
    box-shadow:
      0 0 0 1px rgba(99,255,149,.36),
      0 0 12px rgba(99,255,149,1),
      0 0 26px rgba(99,255,149,.96),
      0 0 40px rgba(99,255,149,.60),
      0 0 60px rgba(99,255,149,.22) !important;
  }
}

html.theme-light .brand .dot,
html.theme-light .nav .dot{
  background:#1fd866 !important;
  animation:oxLiveDot307Light 1.12s ease-in-out infinite !important;
  box-shadow:
    0 0 0 1px rgba(31,216,102,.22),
    0 0 8px rgba(31,216,102,.62),
    0 0 16px rgba(31,216,102,.40),
    0 0 26px rgba(31,216,102,.18) !important;
}

@keyframes oxLiveDot307Light{
  0%,100%{
    opacity:.84;
    transform:scale(1);
    box-shadow:
      0 0 0 1px rgba(31,216,102,.20),
      0 0 7px rgba(31,216,102,.56),
      0 0 14px rgba(31,216,102,.34),
      0 0 22px rgba(31,216,102,.14) !important;
  }
  50%{
    opacity:1;
    transform:scale(1.06);
    box-shadow:
      0 0 0 1px rgba(31,216,102,.24),
      0 0 10px rgba(31,216,102,.72),
      0 0 18px rgba(31,216,102,.42),
      0 0 28px rgba(31,216,102,.18) !important;
  }
}

@media (max-width: 860px){
  .nav,
  .topbar{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto auto;
    align-items:center;
    gap:10px;
    padding:12px !important;
  }

  .brand{
    min-width:0;
    margin-right:0;
  }

  .brand-name{
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .theme-toggle{
    order:2;
    margin-left:0 !important;
    justify-self:end;
  }

  .burger{
    order:3;
    margin-left:0 !important;
    justify-self:end;
  }

  .menu{
    order:4;
    grid-column:1 / -1;
    left:0 !important;
    right:0 !important;
    top:calc(100% + 8px) !important;
  }
}

@media (max-width: 560px){
  .nav,
  .topbar{
    grid-template-columns:minmax(0,1fr) 40px 40px;
    gap:8px;
    padding:10px !important;
  }

  .theme-toggle,
  .burger{
    width:40px !important;
    height:40px !important;
    min-width:40px;
    min-height:40px;
  }

  .brand{
    gap:10px;
  }

  .brand-name{
    font-size:clamp(17px, 5vw, 20px);
    letter-spacing:.12em;
  }

  .menu{
    top:calc(100% + 6px) !important;
  }
}


/* ============================================================
   v0.3.9 — light theme readability / retro ink pass
   Fixes washed-out white mode by using darker retro ink,
   stronger hierarchy, and cleaner glitch contrast.
   ============================================================ */
html.theme-light{
  --retro-text:#16120f;
  --retro-muted:#504840;
  --retro-ink:#120f0d;
  --retro-ink-soft:#352d27;
  --retro-ink-faint:#6a6056;
}

html.theme-light,
html.theme-light body{
  color:var(--retro-text);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

html.theme-light body::after{
  opacity:.10;
}

html.theme-light .nav,
html.theme-light .topbar,
html.theme-light .portal-panel,
html.theme-light .about-panel,
html.theme-light .card,
html.theme-light .resume-grid > .card,
html.theme-light .module-card,
html.theme-light .video-embed,
html.theme-light .footer,
html.theme-light .mobile-actions,
html.theme-light .hero-box,
html.theme-light .about-profile,
html.theme-light .about-core,
html.theme-light .about-row,
html.theme-light .logo-frame,
html.theme-light .btn,
html.theme-light .theme-toggle,
html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .info-chip,
html.theme-light .quick-command,
html.theme-light .module-list a{
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0) 18%),
    linear-gradient(180deg, rgba(251,247,240,.99), rgba(238,230,219,.97)) !important;
  border-color:rgba(122,76,45,.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    0 0 0 1px rgba(86,57,38,.08),
    0 16px 30px rgba(98,73,52,.12) !important;
}

html.theme-light h1,
html.theme-light h2,
html.theme-light h3,
html.theme-light .module-title,
html.theme-light .about-row strong,
html.theme-light .brand-name,
html.theme-light .menu a,
html.theme-light .btn,
html.theme-light .panel-kicker,
html.theme-light .section-kicker{
  font-family:"Share Tech Mono","IBM Plex Mono",ui-monospace,monospace !important;
  color:var(--retro-ink) !important;
  font-weight:700 !important;
  letter-spacing:.08em;
  text-shadow:none !important;
}

html.theme-light .brand-name,
html.theme-light .module-title,
html.theme-light .about-row strong,
html.theme-light .section-heading h2,
html.theme-light .about-panel h2,
html.theme-light .card h2{
  color:var(--retro-ink) !important;
}

html.theme-light p,
html.theme-light li,
html.theme-light .subtitle,
html.theme-light .about-profile p,
html.theme-light .about-row p,
html.theme-light .card p,
html.theme-light .module-card p,
html.theme-light .terminal-preview pre,
html.theme-light .info-chip .v,
html.theme-light .quick-command,
html.theme-light .module-arrow,
html.theme-light .footer,
html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .muted{
  color:var(--retro-ink-soft) !important;
  font-weight:500;
  text-shadow:none !important;
}

html.theme-light .subtitle{
  font-size:17px;
  line-height:1.7;
}

html.theme-light .panel-kicker,
html.theme-light .section-kicker{
  color:#0c9c4b !important;
}
html.theme-light .panel-kicker::before,
html.theme-light .section-kicker::before{
  color:rgba(12,156,75,.78) !important;
}

html.theme-light .menu a{
  color:var(--retro-ink-soft) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,0) 18%),
    linear-gradient(180deg, rgba(251,247,240,.99), rgba(238,230,219,.97)) !important;
}

html.theme-light .menu a:hover,
html.theme-light .menu a:focus-visible,
html.theme-light .menu a.active{
  color:var(--retro-ink) !important;
  border-color:rgba(122,76,45,.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 0 0 1px rgba(217,77,34,.10),
    0 0 16px rgba(217,77,34,.10) !important;
}

html.theme-light .menu a.glitch-nav::before{
  color:rgba(217,77,34,.62) !important;
  opacity:.30 !important;
}
html.theme-light .menu a.glitch-nav::after{
  color:rgba(26,135,165,.56) !important;
  opacity:.26 !important;
}
html.theme-light .menu a.glitch-nav:hover::before,
html.theme-light .menu a.glitch-nav:hover::after,
html.theme-light .menu a.glitch-nav.active::before,
html.theme-light .menu a.glitch-nav.active::after{
  opacity:.46 !important;
}

html.theme-light .hero-glitch{
  color:var(--retro-ink) !important;
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:var(--retro-ink) !important;
  text-shadow:
    1px 0 0 rgba(217,77,34,.16),
    -1px 0 0 rgba(26,135,165,.12) !important;
  filter:none !important;
}
html.theme-light .hero-glitch::before{
  color:rgba(217,77,34,.70) !important;
  opacity:.32 !important;
}
html.theme-light .hero-glitch::after{
  color:rgba(26,135,165,.66) !important;
  opacity:.28 !important;
}

html.theme-light .module-arrow,
html.theme-light a.module-arrow,
html.theme-light .module-card .module-arrow{
  color:#c84f26 !important;
}

html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .info-chip,
html.theme-light .btn,
html.theme-light .theme-toggle{
  border-color:rgba(122,76,45,.20) !important;
}

html.theme-light .logo-gif{
  filter:contrast(1.08) saturate(.98);
}

@media (max-width: 720px){
  html.theme-light .subtitle,
  html.theme-light .about-profile p,
  html.theme-light .about-row p,
  html.theme-light .module-card p,
  html.theme-light .card p{
    font-size:15px;
    line-height:1.72;
  }

  html.theme-light .module-title,
  html.theme-light .about-row strong,
  html.theme-light .brand-name{
    letter-spacing:.07em;
  }
}

/* ============================================================
   v0.3.9 — print portal / paper panel pass
   Light mode now uses flatter retro paper panels, sharper ink,
   squarer geometry, and less glossy modern card treatment.
   ============================================================ */
html.theme-light{
  --retro-paper:#f2eadc;
  --retro-paper-deep:#eadfce;
  --retro-panel:#f7f0e4;
  --retro-edge:#bda487;
  --retro-edge-strong:#8f7459;
  --retro-ink:#11100e;
  --retro-ink-soft:#2a241d;
  --retro-ink-faint:#5b4f42;
}

html.theme-light body::before{
  opacity:.14;
}

html.theme-light .nav,
html.theme-light .topbar,
html.theme-light .portal-panel,
html.theme-light .about-panel,
html.theme-light .card,
html.theme-light .resume-grid > .card,
html.theme-light .module-card,
html.theme-light .video-embed,
html.theme-light .footer,
html.theme-light .mobile-actions,
html.theme-light .hero-box,
html.theme-light .about-profile,
html.theme-light .about-core,
html.theme-light .about-row,
html.theme-light .logo-frame,
html.theme-light .btn,
html.theme-light .burger,
html.theme-light .theme-toggle,
html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .info-chip,
html.theme-light .quick-command,
html.theme-light .module-list a{
  border-radius:4px !important;
  backdrop-filter:none !important;
  background:
    repeating-linear-gradient(180deg, rgba(44,31,20,.018) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,0) 12%),
    linear-gradient(180deg, var(--retro-panel), var(--retro-paper-deep)) !important;
  border:1px solid var(--retro-edge-strong) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.34),
    inset 0 0 0 2px rgba(124,96,72,.08),
    0 1px 0 rgba(255,255,255,.42),
    0 8px 18px rgba(71,53,39,.07) !important;
}

html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .info-chip,
html.theme-light .btn,
html.theme-light .burger,
html.theme-light .theme-toggle,
html.theme-light .module-list a,
html.theme-light .quick-command,
html.theme-light .menu a{
  border-radius:3px !important;
}

html.theme-light .nav,
html.theme-light .topbar,
html.theme-light .footer{
  border-radius:3px !important;
}

html.theme-light h1,
html.theme-light h2,
html.theme-light h3,
html.theme-light .module-title,
html.theme-light .about-row strong,
html.theme-light .brand-name,
html.theme-light .menu a,
html.theme-light .btn,
html.theme-light .panel-kicker,
html.theme-light .section-kicker{
  color:var(--retro-ink) !important;
  font-weight:800 !important;
  letter-spacing:.055em !important;
  text-shadow:none !important;
  opacity:1 !important;
}

html.theme-light .module-title,
html.theme-light .about-row strong,
html.theme-light .section-heading h2,
html.theme-light .about-panel h2,
html.theme-light .card h2{
  color:var(--retro-ink) !important;
  text-transform:uppercase;
}

html.theme-light p,
html.theme-light li,
html.theme-light .subtitle,
html.theme-light .about-profile p,
html.theme-light .about-row p,
html.theme-light .card p,
html.theme-light .module-card p,
html.theme-light .terminal-preview pre,
html.theme-light .info-chip .v,
html.theme-light .quick-command,
html.theme-light .module-arrow,
html.theme-light .footer,
html.theme-light .chip,
html.theme-light .tech-tag,
html.theme-light .muted{
  color:var(--retro-ink-soft) !important;
  font-weight:600 !important;
  opacity:1 !important;
}

html.theme-light .subtitle,
html.theme-light .about-profile p,
html.theme-light .about-row p,
html.theme-light .module-card p,
html.theme-light .card p{
  line-height:1.58;
}

html.theme-light .panel-kicker,
html.theme-light .section-kicker{
  color:#0b9e49 !important;
  letter-spacing:.16em !important;
}

html.theme-light .module-title,
html.theme-light .about-row strong{
  font-size:clamp(20px, 2vw, 24px);
}

html.theme-light .hero-glitch{
  color:var(--retro-ink) !important;
  -webkit-text-fill-color:var(--retro-ink) !important;
  text-shadow:
    1px 0 0 rgba(200,79,38,.22),
    -1px 0 0 rgba(26,135,165,.16) !important;
  letter-spacing:.06em !important;
}

html.theme-light .hero-glitch::before{
  color:rgba(200,79,38,.66) !important;
  opacity:.24 !important;
}
html.theme-light .hero-glitch::after{
  color:rgba(26,135,165,.60) !important;
  opacity:.20 !important;
}

html.theme-light .menu a{
  color:var(--retro-ink-soft) !important;
  background:
    repeating-linear-gradient(180deg, rgba(44,31,20,.018) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,0) 12%),
    linear-gradient(180deg, #f7f0e4, #ecdfcd) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.26),
    0 1px 2px rgba(71,53,39,.04) !important;
}

html.theme-light .menu a:hover,
html.theme-light .menu a:focus-visible,
html.theme-light .menu a.active{
  color:var(--retro-ink) !important;
  border-color:#9d7b5c !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.24),
    inset 0 -2px 0 rgba(200,79,38,.16),
    0 2px 6px rgba(71,53,39,.06) !important;
}

html.theme-light .module-card,
html.theme-light .about-row,
html.theme-light .about-profile,
html.theme-light .hero-box,
html.theme-light .portal-panel,
html.theme-light .about-panel{
  overflow:hidden;
}

html.theme-light .module-card::before,
html.theme-light .about-row::before,
html.theme-light .about-profile::before,
html.theme-light .hero-box::before,
html.theme-light .portal-panel::before,
html.theme-light .about-panel::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:rgba(255,255,255,.42);
  pointer-events:none;
}

html.theme-light .module-card p,
html.theme-light .about-row p,
html.theme-light .about-profile p{
  max-width:62ch;
}

html.theme-light .chip,
html.theme-light .tech-tag{
  color:var(--retro-ink-soft) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,0) 18%),
    linear-gradient(180deg, #f6efe3, #efe3d3) !important;
}

html.theme-light .module-arrow,
html.theme-light a.module-arrow,
html.theme-light .module-card .module-arrow{
  color:#bc4a24 !important;
  font-weight:700 !important;
}

@media (max-width:720px){
  html.theme-light .nav,
  html.theme-light .topbar,
  html.theme-light .footer{
    border-radius:2px !important;
  }

  html.theme-light .portal-panel,
  html.theme-light .about-panel,
  html.theme-light .card,
  html.theme-light .module-card,
  html.theme-light .about-row,
  html.theme-light .hero-box,
  html.theme-light .about-profile,
  html.theme-light .logo-frame{
    border-radius:3px !important;
  }
}