:root{
  color-scheme:light;
  --paper:#fafafa;
  --ink:#202020;
  --muted:#4c4c4c;
  --rule:#888;
  --soft:#e8e8e8;
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:36px
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:13px/1.85 var(--mono);
  isolation:isolate;
  overflow-x:hidden
}
a{
  color:inherit;
  text-decoration:none
}
a:hover{
  text-decoration:underline;
  text-underline-offset:4px
}
button{
  font:inherit;
  color:inherit
}
button,a,summary{
  touch-action:manipulation
}
button:focus-visible,a:focus-visible,summary:focus-visible,.calendar-scroll:focus-visible{
  outline:2px dashed var(--ink);
  outline-offset:5px
}
.content-width{
  width:min(880px,calc(100% - 56px));
  margin-inline:auto
}
main,header{
  position:relative;
  z-index:1
}
.ambient-field{
  position:fixed;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  user-select:none
}
.ambient-field canvas{
  position:absolute;
  width:110vw;
  height:100svh;
  left:12vw;
  top:0;
  filter:none;
  opacity:.6;
  mix-blend-mode:normal
}
.site-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding-block:30px;
  font-size:11px
}
.identity{
  font-weight:700;
  letter-spacing:-.04em
}
.site-nav{
  display:flex;
  gap:24px;
  color:var(--muted)
}
.site-nav a:hover{
  color:var(--ink)
}
.skip-link{
  position:fixed;
  top:12px;
  left:16px;
  z-index:20;
  padding:6px 12px;
  background:var(--paper);
  transform:translateY(-160%)
}
.skip-link:focus{
  transform:none
}
.hero{
  padding:72px 0 48px
}
.hero-topline{
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:11px;
  color:var(--muted);
  letter-spacing:.07em
}
.hero h1{
  margin:29px 0 24px
}
.ascii-art{
  display:block;
  margin:0;
  font-weight:400;
  white-space:pre;
  font-family:var(--mono);
  line-height:1.08;
  letter-spacing:0;
  overflow:visible
}
.hero .ascii-art{
  font-size:clamp(7.6px,1.3vw,14px);
  font-weight:700
}
.hero-role{
  font-size:18px;
  letter-spacing:-.04em;
  margin:0 0 17px
}
.hero-description{
  color:var(--muted);
  max-width:68ch
}
.hero-description p{
  margin:0 0 10px
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px 22px;
  margin-top:26px;
  font-size:11px;
  font-weight:600
}
.hero-note{
  margin-top:30px;
  color:var(--muted);
  font-size:10px
}
.hero-note span{
  color:var(--ink)
}
.cursor{
  animation:blink 1.6s steps(1) infinite
}
@keyframes blink{
  50%{
    opacity:0
  }
}
.section{
  position:relative;
  padding:48px 0 20px;
  scroll-margin-top:24px
}
.section.content-width,.contact.content-width{
  width:100%
}
.section>.ascii-rule,.contact>.ascii-rule{
  position:absolute;
  top:0;
  left:0;
  right:0;
  overflow:hidden;
  white-space:nowrap;
  color:var(--rule);
  font-size:11px;
  line-height:1
}
.section-heading{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  margin-bottom:23px;
  min-width:0
}
.section-heading h2,.contact h2{
  margin:0;
  min-width:0;
  line-height:1
}
.section-heading .ascii-art,.contact .ascii-art{
  font-size:7px;
  color:var(--ink)
}
.section-aside,.section-aside-link{
  margin:0;
  color:var(--muted);
  font:9px/1.8 var(--mono);
  text-align:right;
  max-width:260px
}
.section-description{
  color:var(--muted);
  margin:-6px 0 18px;
  font-size:11px
}
.calendar-panel{
  margin:0 0 18px;
  background:var(--paper);
  padding:6px 0
}
.calendar-scroll{
  overflow-x:auto;
  padding:8px 0 12px;
  scrollbar-width:thin;
  scrollbar-color:var(--muted) transparent
}
.calendar-months{
  display:grid;
  grid-template-columns:repeat(var(--weeks,53),12px);
  gap:4px;
  width:max-content;
  min-width:100%;
  height:23px;
  font-size:11px;
  color:var(--muted)
}
.calendar-months span{
  overflow:visible;
  white-space:nowrap
}
.contribution-grid{
  display:grid;
  grid-auto-flow:column;
  grid-template-rows:repeat(7,12px);
  grid-auto-columns:12px;
  gap:4px;
  width:max-content;
  min-width:100%;
  line-height:12px;
  font-size:12px;
  text-align:center
}
.contribution-cell{
  display:block;
  width:12px;
  height:12px;
  font-weight:700;
  cursor:help;
  color:var(--level-0)
}
.contribution-cell[data-level="1"]{
  color:var(--muted)
}
.contribution-cell[data-level="2"]{
  color:var(--level-2)
}
.contribution-cell[data-level="3"]{
  color:var(--level-3)
}
.contribution-cell[data-level="4"]{
  color:var(--ink)
}
.contribution-cell.is-padding{
  visibility:hidden
}
.calendar-panel figcaption{
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:11px;
  color:var(--muted);
  margin-top:10px
}
.calendar-legend{
  font-size:12px;
  letter-spacing:3px;
  color:var(--ink);
  padding:0 9px
}
.data-status{
  font-size:10px;
  color:var(--muted);
  margin:0 0 16px
}
.recent-events{
  font-size:10px;
  padding-bottom:16px
}
.recent-events summary{
  cursor:pointer;
  list-style:none;
  color:var(--muted);
  padding:8px 0
}
.recent-events summary::-webkit-details-marker{
  display:none
}
.recent-events[open] summary{
  font-weight:700;
  color:var(--ink)
}
.activity-topline{
  display:flex;
  justify-content:space-between;
  font-size:8px;
  color:var(--muted);
  padding-block:10px
}
.activity-list{
  list-style:none;
  padding:0;
  margin:0
}
.activity-item{
  display:grid;
  grid-template-columns:72px 1fr;
  gap:5px 12px;
  padding:9px 0;
  border-top:1px dotted var(--rule)
}
.activity-date{
  color:var(--muted);
  font-size:11px
}
.activity-description{
  font-size:10px
}
.activity-repo{
  grid-column:2;
  color:var(--muted);
  font-size:11px;
  overflow-wrap:anywhere
}
.activity-footnote{
  font-size:11px;
  color:var(--muted)
}
.pr-filters{
  display:flex;
  gap:4px;
  flex-shrink:0
}
.pr-filters button{
  border:0;
  background:none;
  padding:8px 6px;
  cursor:pointer;
  color:var(--muted);
  font-size:10px;
  min-height:36px
}
.pr-filters button::before{
  content:"[ ";
  color:var(--muted)
}
.pr-filters button::after{
  content:" ]";
  color:var(--muted)
}
.pr-filters button[aria-pressed="true"]{
  color:var(--ink);
  font-weight:700
}
.pr-filters button[aria-pressed="true"]::before{
  content:"[ ";
  color:var(--ink)
}
.pr-filters button[aria-pressed="true"]::after{
  color:var(--ink)
}
.pr-list{
  background:var(--paper)
}
.pr-row{
  padding:15px 0 20px;
  border-top:1px dotted var(--rule)
}
.pr-meta{
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:11px;
  color:var(--muted)
}
.pr-row h3{
  font-size:13px;
  font-weight:600;
  line-height:1.7;
  margin:8px 0;
  overflow-wrap:anywhere
}
.pr-row p{
  font-size:11px;
  color:var(--muted);
  margin:5px 0
}
.pr-status{
  font-size:11px;
  white-space:nowrap
}
.text-link{
  display:inline-block;
  font-size:10px;
  font-weight:600;
  margin-top:10px
}
.project-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:26px 34px
}
.project,.workbench-item,.skill-group,.writing-item,.education-entry{
  position:relative;
  padding:19px 0 12px;
  min-width:0
}
.project>.ascii-rule,.workbench-item>.ascii-rule,.skill-group>.ascii-rule,.writing-item>.ascii-rule,.education-entry>.ascii-rule{
  position:absolute;
  top:0;
  left:0;
  right:0;
  overflow:hidden;
  white-space:nowrap;
  color:var(--rule);
  font-size:11px;
  line-height:1
}
.project h3,.workbench-item h3,.education-entry h3,.journey-list h3{
  font-size:16px;
  line-height:1.5;
  letter-spacing:-.03em;
  margin:9px 0 10px
}
.project p,.workbench-item p{
  font-size:11px;
  color:var(--muted);
  margin:10px 0;
  line-height:1.9
}
.project .project-tagline{
  color:var(--ink);
  font-size:12px
}
.project-context{
  font:8px/1.8 var(--mono)!important;
  letter-spacing:.03em;
  color:var(--muted)!important;
  margin:0!important
}
.tag-list{
  display:flex;
  flex-wrap:wrap;
  gap:5px 9px;
  list-style:none;
  padding:0;
  margin:15px 0 4px
}
.tag-list li{
  font-size:11px;
  color:var(--muted)
}
.tag-list li::before{
  content:"["
}
.tag-list li::after{
  content:"]"
}
.project-feature{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 1.2fr;
  column-gap:48px
}
.project-feature .project-context,.project-feature h3,.project-feature .project-tagline{
  grid-column:1
}
.project-feature>p:not(.project-context):not(.project-tagline){
  grid-column:2;
  grid-row:2/5;
  margin-top:9px
}
.project-feature .text-link{
  grid-column:1
}
.skill-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px 34px
}
.skill-group h3{
  font-size:11px;
  margin:2px 0 8px
}
.skill-group p{
  font-size:10px;
  color:var(--muted);
  margin:0
}
.workbench-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:34px
}
.education-entry h3{
  font-size:13px
}
.education-entry>p:last-child{
  font-size:11px;
  color:var(--muted);
  margin:5px 0
}
.education-score{
  display:block;
  font-size:10px;
  color:var(--ink);
  margin-top:7px
}
.journey-list{
  list-style:none;
  padding:0;
  margin:12px 0 0
}
.journey-list li{
  display:grid;
  grid-template-columns:130px 1fr;
  gap:25px;
  padding:22px 0;
  border-top:1px dotted var(--rule)
}
.journey-list time{
  font-size:11px;
  color:var(--muted);
  padding-top:2px
}
.journey-list h3{
  font-size:13px;
  margin:5px 0 8px
}
.journey-list p:not(.project-context){
  font-size:11px;
  color:var(--muted);
  margin:0
}
.writing-list{
  display:grid;
  gap:24px
}
.writing-item{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:6px 26px
}
.writing-item .project-context{
  grid-row:span 2
}
.writing-item h3{
  font-size:13px;
  line-height:1.8;
  font-weight:500;
  margin:0
}
.writing-item p:last-child{
  font-size:11px;
  color:var(--muted);
  margin:0
}
.contact{
  position:relative;
  margin-top:58px;
  padding-top:48px;
  padding-bottom:25px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:35px
}
.contact .eyebrow{
  font-size:11px;
  color:var(--muted);
  margin:0 0 18px
}
.contact-email{
  display:inline-block;
  font-size:12px;
  margin-top:24px
}
.contact-links{
  display:grid;
  align-content:end;
  grid-template-columns:1fr 1fr;
  gap:10px 20px;
  font-size:10px
}
.footer-line{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  padding-top:24px;
  border-top:1px dotted var(--rule);
  font-size:8px;
  color:var(--muted)
}
.noscript{
  position:relative;
  z-index:1;
  padding:15px 28px;
  font:11px var(--mono)
}
.sr-only,.visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
[hidden]{
  display:none!important
}
@media(min-width:1100px){
  .hero{
    padding-top:94px;
    padding-bottom:60px
  }
  .section{
    padding-top:50px;
    padding-bottom:28px
  }
}
@media(max-width:680px){
  .content-width{
    width:calc(100% - 36px)
  }
  .site-header{
    padding-block:22px;
    gap:14px
  }
  .site-nav{
    gap:13px;
    font-size:11px
  }
  .identity{
    font-size:10px;
    white-space:nowrap
  }
  .hero{
    padding-top:49px;
    padding-bottom:40px
  }
  .hero-topline{
    font-size:7px;
    gap:12px
  }
  .hero .ascii-art{
    font-size:min(8px,1.9vw)
  }
  .hero-role{
    font-size:15px
  }
  .hero-description{
    font-size:11px
  }
  .hero-actions{
    font-size:11px;
    gap:10px 14px
  }
  .section{
    padding:36px 0 22px
  }
  .section-heading{
    align-items:flex-start;
    flex-direction:column;
    gap:18px;
    margin-bottom:22px
  }
  .section-heading .ascii-art,.contact .ascii-art{
    font-size:6px
  }
  .section-aside,.section-aside-link{
    text-align:left;
    max-width:none
  }
  .calendar-panel figcaption{
    font-size:8px;
    gap:10px
  }
  .calendar-legend{
    font-size:10px;
    padding-inline:2px;
    letter-spacing:1px
  }
  .project-grid,.workbench-grid,.skill-grid{
    grid-template-columns:1fr
  }
  .project-feature{
    display:block;
    grid-column:auto
  }
  .project-grid{
    gap:23px
  }
  .skill-grid{
    gap:20px
  }
  .pr-filters{
    margin-top:-7px
  }
  .pr-meta{
    font-size:8px;
    flex-wrap:wrap;
    gap:6px
  }
  .journey-list li{
    grid-template-columns:1fr;
    gap:9px
  }
  .writing-item{
    grid-template-columns:1fr;
    gap:8px
  }
  .writing-item .project-context{
    grid-row:auto
  }
  .contact{
    grid-template-columns:1fr;
    margin-top:30px;
    gap:26px
  }
  .contact-links{
    max-width:280px
  }
  .footer-line{
    font-size:7px;
    gap:12px
  }
  .ambient-field canvas{
    left:-22vw;
    width:160vw;
    opacity:.45
  }
  .activity-item{
    grid-template-columns:60px 1fr
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  .cursor{
    animation:none
  }
}
.retry-button{
  font:inherit;
  color:var(--ink);
  background:none;
  border:0;
  padding:4px;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px
}
html{
  scrollbar-width:thin;
  scrollbar-color:var(--muted) var(--paper)
}
.calendar-panel{
  min-height:191px
}
.pr-list{
  min-height:95px
}

/* Content owns its surface; the ember field remains visible in the margins. */
:root { --level-0:#747474; --level-2:#494949; --level-3:#292929; }
:root[data-theme="dark"] {
  color-scheme:dark;
  --paper:#111110; --ink:#f4f1eb; --muted:#c0bbb3;
  --rule:#77726b; --soft:#302e2a;
  --level-0:#858079; --level-2:#c5beb4; --level-3:#e2dcd2;
}
main { background:var(--paper); box-shadow:0 0 48px 32px var(--paper); }
.site-header { background:var(--paper); flex-wrap:wrap; }
.site-nav { margin-left:auto; }
#theme-toggle { background:var(--paper); border:1px dashed var(--rule); padding:7px 10px; cursor:pointer; font-size:11px; min-height:36px; }
#theme-toggle:hover { background:var(--soft); }
.contribution-cell { background:var(--soft); }
.contribution-cell[data-level="1"] { color:var(--muted); }
.calendar-panel { padding:12px 0; }
.calendar-legend { color:var(--ink); font-weight:700; }
:root[data-theme="dark"] .ambient-field canvas { opacity:.85; }
@media (max-width:680px) {
  .site-nav { order:3; width:100%; justify-content:space-between; margin-left:0; font-size:11px; }
  #theme-toggle { margin-left:auto; }
}

/* Visual refresh: readable type, transparent layers, and illustrated work. */
:root { --accent:#ad4b22; --surface:rgba(250,250,250,.72); --tile:rgba(255,255,255,.65); --sans:Inter,"Helvetica Neue",Arial,sans-serif; }
:root[data-theme="dark"] { --accent:#f5a16f; --surface:rgba(17,17,16,.72); --tile:rgba(35,33,30,.74); }
body { font-size:14px; }
.content-width { width:min(1040px,calc(100% - 64px)); }
main { background:transparent; box-shadow:none; }
.site-header { background:var(--surface); border-bottom:1px solid var(--soft); padding:20px 0; }
.site-nav { font-size:12px; gap:24px; }
.ambient-field canvas { left:8vw; width:100vw; opacity:.72; }
:root[data-theme="dark"] .ambient-field canvas { opacity:.9; }
.hero { position:relative; padding:76px 0 56px; min-height:580px; }
.hero-topline { font-size:11px; color:var(--muted); letter-spacing:.08em; }
h1,h2,h3 { font-family:var(--sans); }
.hero h1 { font:600 clamp(72px,9vw,124px)/.92 var(--sans); letter-spacing:-.075em; margin:38px 0 28px; }
.hero h1 span { color:var(--accent); }
.hero-role { font:500 24px/1.4 var(--sans); letter-spacing:-.025em; }
.hero-description { max-width:52ch; font:15px/1.85 var(--sans); color:var(--ink); }
.hero-description p { background:var(--surface); width:fit-content; }
.hero-actions { gap:20px; font-size:12px; }
.hero-actions a:first-child { background:var(--ink); color:var(--paper); padding:9px 14px; border-radius:4px; }
.hero-note { font-size:11px; }
.hero-coordinate { position:absolute; top:180px; right:0; width:230px; display:grid; gap:12px; color:var(--accent); font-size:10px; letter-spacing:.07em; }
.hero-coordinate i { width:100%; height:170px; border:1px solid currentColor; border-radius:50%; transform:rotate(-25deg) scaleY(.4); opacity:.5; }
.section,.contact { background:var(--surface); padding:36px 28px; margin:22px -28px; border:1px solid var(--soft); border-radius:10px; backdrop-filter:none; }
.section>.ascii-rule,.contact>.ascii-rule { display:none; }
.section-heading h2,.contact h2 { font:600 clamp(25px,3vw,34px)/1.2 var(--sans); letter-spacing:-.045em; margin:0; }
.section-heading { margin-bottom:28px; }
.section-aside { font-size:11px; }
.calendar-panel,.pr-list { background:transparent; }
.calendar-panel { min-height:0; }
.contribution-cell { border-radius:2px; }
.section-description,.data-status,.pr-row p { font-size:13px; }
.pr-row h3 { font:600 18px/1.4 var(--sans); }
.pr-filters { background:var(--tile); border:1px solid var(--soft); border-radius:6px; padding:3px; }
.pr-filters button { font-size:12px; padding:7px 10px; }
.pr-filters button[aria-pressed="true"] { background:var(--soft); border-radius:4px; }
.skill-grid { gap:24px; }
.skill-group { padding:0; }
.skill-group h3 { font:500 13px/1.5 var(--mono); color:var(--muted); margin-bottom:14px; }
.tech-tiles { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px; }
.tech-tiles li { display:flex; align-items:center; gap:9px; padding:12px; border:1px solid var(--soft); background:var(--tile); border-radius:6px; font:12px/1.3 var(--sans); }
.tech-tiles img { object-fit:contain; }
.tech-symbol { width:30px; height:30px; display:grid; place-items:center; font:600 12px var(--mono); color:var(--accent); }
.project-grid { gap:24px; }
.project { padding:0 0 20px; overflow:hidden; background:var(--tile); border:1px solid var(--soft); border-radius:8px; }
.project>.ascii-rule { display:none; }
.project>p,.project>h3,.project>.tag-list,.project>.text-link { margin-left:20px; margin-right:20px; }
.project h3 { font-size:23px; letter-spacing:-.035em; }
.project p,.workbench-item p { font:14px/1.75 var(--sans); }
.project .project-tagline { font-size:15px; color:var(--ink); }
.project-context { font-size:10px!important; margin-top:18px!important; }
.project-feature { display:block; grid-column:auto; }
.project-feature>p:not(.project-context):not(.project-tagline) { margin-top:10px; }
.project-last { grid-column:auto; }
.project-visual { height:190px; position:relative; background:radial-gradient(ellipse at 40% 50%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 75%); color:var(--accent); border-bottom:1px solid var(--soft); overflow:hidden; }
.project-visual svg { width:100%; height:150px; margin-top:24px; }
.visual-label,.visual-index { position:absolute; left:16px; font:9px var(--mono); letter-spacing:.09em; }
.visual-label { top:14px; }
.visual-index { bottom:12px; opacity:.7; }
.visual-1,.visual-4 { color:#54a5ae; }
.visual-2,.visual-6 { color:#ae8fca; }
.visual-3,.visual-5 { color:#78a987; }
.signal-dot { animation:signal 4s linear infinite; }
@keyframes signal { from{transform:translateX(-65px)} to{transform:translateX(230px)} }
.text-link { font-size:12px; color:var(--accent); }
.workbench-item { padding:20px; background:var(--tile); border:1px solid var(--soft); border-radius:6px; }
.workbench-item>.ascii-rule { display:none; }
.workbench-item h3 { font-size:24px; }
.writing-item h3 { font:600 22px/1.4 var(--sans); letter-spacing:-.03em; }
.writing-item { padding:25px 0; }
.education-entry h3,.journey-list h3 { font-size:20px; }
.journey-list p,.education-entry>p:last-child { font:14px/1.75 var(--sans); }
.contact { padding-block:48px; }
.contact h2 { font-size:44px; }
@media(max-width:680px) {
 .content-width { width:calc(100% - 36px); }
 .section,.contact { margin:18px 0; padding:24px 16px; }
 .hero { min-height:0; padding:44px 0 28px; }
 .hero h1 { font-size:76px; margin:28px 0; }
 .hero-role { font-size:21px; }
 .hero-description { font-size:14px; }
 .hero-coordinate { display:none; }
 .hero-topline { font-size:9px; }
 .hero-actions { font-size:11px; gap:14px; }
 .section-heading h2 { font-size:27px; }
 .skill-grid,.project-grid,.workbench-grid { grid-template-columns:1fr; }
 .tech-tiles li { padding:10px; }
 .ambient-field canvas { left:-30vw; width:160vw; opacity:.6; }
 .section-heading { gap:16px; }
 .contact h2 { font-size:32px; }
}
@media(prefers-reduced-motion:reduce) { .signal-dot { animation:none; } }

.tech-tiles img { background:#f5f3ee; border-radius:4px; padding:3px; }

/* Ember contribution scale, shared by calendar and legend. */
:root { --ember-0:#e5ddd7; --ember-1:#e9b292; --ember-2:#d67e49; --ember-3:#ad4d20; --ember-4:#78300e; }
:root[data-theme="dark"] { --ember-0:#332b26; --ember-1:#64351f; --ember-2:#a14c24; --ember-3:#e28042; --ember-4:#ffc18a; }
.contribution-cell[data-level="0"],.calendar-legend i[data-level="0"] { background:var(--ember-0); }
.contribution-cell[data-level="1"],.calendar-legend i[data-level="1"] { background:var(--ember-1); }
.contribution-cell[data-level="2"],.calendar-legend i[data-level="2"] { background:var(--ember-2); }
.contribution-cell[data-level="3"],.calendar-legend i[data-level="3"] { background:var(--ember-3); }
.contribution-cell[data-level="4"],.calendar-legend i[data-level="4"] { background:var(--ember-4); }
.contribution-cell { transition:transform .18s,box-shadow .18s; }
.contribution-cell:hover { transform:scale(1.3); box-shadow:0 0 8px var(--accent); }
.calendar-padding { visibility:hidden; }
.calendar-legend { display:inline-flex; gap:4px; margin-inline:10px; vertical-align:middle; }
.calendar-legend i { display:block; width:12px; height:12px; border-radius:2px; }
#open-source-title,.pr-filters button[data-pr-filter="open"],.pr-status { color:var(--accent); }
.section { position:relative; overflow:hidden; }
.section::after { content:". : / + = # / : ." / ""; position:absolute; right:24px; top:10px; font:10px var(--mono); letter-spacing:6px; color:var(--accent); opacity:0; pointer-events:none; }
.section.entered::after { animation:ascii-sweep 1.3s ease-out both; }
.section.entered>.section-heading { animation:section-arrive .65s ease-out both; }
.project:hover .diagram-flow { stroke-dashoffset:-60; transition:stroke-dashoffset 1.5s; }
.project:hover .project-visual { filter:brightness(1.18); transition:filter .35s; }
@keyframes ascii-sweep { 0%{opacity:0;transform:translateX(-160px)} 30%{opacity:.8} 100%{opacity:0;transform:translateX(40px)} }
@keyframes section-arrive { from{transform:translateY(10px);filter:blur(2px)} to{transform:translateY(0);filter:blur(0)} }
@media(prefers-reduced-motion:reduce) { .section.entered::after,.section.entered>.section-heading { animation:none; } .contribution-cell,.project:hover .diagram-flow { transition:none; } }

/* Every project illustration is a live, printable ASCII character field. */
.project-visual { height:225px; background:var(--tile); color:var(--accent); }
.space-art { position:absolute; inset:28px 0 25px; display:flex; align-items:center; justify-content:center; margin:0; white-space:pre; overflow:hidden; font:7px/6.4px var(--mono); letter-spacing:0; user-select:none; }
.visual-1,.visual-4 { color:#e8ad79; }
.visual-2,.visual-6 { color:#c99aa2; }
.visual-3,.visual-5 { color:#e2bd89; }
.project:hover .space-art { text-shadow:0 0 5px currentColor; }
.project-visual::after { content:"+ . : . +" / ""; position:absolute; right:16px; top:12px; font:10px var(--mono); opacity:.45; letter-spacing:6px; }
.workbench-item::after { content:".   +    .     :    ." / ""; display:block; margin-top:16px; color:var(--accent); letter-spacing:7px; font:12px var(--mono); }
.hero-topline { color:var(--accent); }
@media(max-width:680px) { .space-art { font-size:5px; line-height:6px; } .project-visual { height:220px; } }

.page-index { position:fixed;left:24px;top:145px;width:138px;z-index:5;font:12px/1.5 var(--mono); }
.page-index p {font-size:10px;letter-spacing:.2em;color:var(--muted);margin-bottom:22px;}
.page-index nav {display:grid;gap:18px;}
.page-index a {color:var(--muted);padding-left:20px;position:relative;}
.page-index a::before {content:"-";position:absolute;left:0;opacity:0;color:var(--accent);}
.page-index a[aria-current],.page-index a:hover {color:var(--ink);}
.page-index a[aria-current]::before {opacity:1;}
.theme-explosion {position:fixed;inset:0;width:100vw;height:100vh;z-index:100;pointer-events:none;}
.visual-1,.visual-4 {color:#935326;}.visual-2,.visual-6 {color:#8c4555;}.visual-3,.visual-5 {color:#816026;}
:root[data-theme="dark"] .visual-1,:root[data-theme="dark"] .visual-4 {color:#e8ad79;}
:root[data-theme="dark"] .visual-2,:root[data-theme="dark"] .visual-6 {color:#c99aa2;}
:root[data-theme="dark"] .visual-3,:root[data-theme="dark"] .visual-5 {color:#e2bd89;}
@media(min-width:1100px){body{padding-left:165px;}}
@media(max-width:1099px){.page-index{position:relative;top:auto;left:auto;width:calc(100% - 36px);margin:18px auto;overflow:auto;}.page-index p{margin:0 0 10px;}.page-index nav{display:flex;gap:20px;width:max-content;padding-bottom:10px;}.page-index a{padding-left:12px;white-space:nowrap;}}

/* The index is the single navigation surface. */
.page-index { top:72px; }
.page-index>p:first-child { font-size:9px; line-height:1.8; }
.index-theme { margin-top:30px; padding-top:22px; border-top:1px dashed var(--rule); }
.index-theme #theme-toggle { font-size:10px; margin:0; width:100%; }
.index-coordinate { font-size:8px!important; letter-spacing:.06em!important; margin-top:20px; }
.hero { padding-top:70px; }
.theme-wave {position:fixed;inset:0;width:100vw;height:100vh;z-index:100;pointer-events:none;}
.section-intro { font:16px/1.8 var(--sans); color:var(--muted); max-width:65ch; margin:0 0 28px; }
.journey-signal { display:grid; grid-template-columns:1.2fr 1fr; border:1px solid var(--soft); background:var(--tile); border-radius:8px; overflow:hidden; margin-bottom:28px; }
.journey-signal .project-visual { height:210px; border:0; }
.journey-facts { display:grid; grid-template-columns:1fr; padding:20px 28px; border-left:1px solid var(--soft); gap:18px; }
.journey-facts div { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; }
.journey-facts strong { font:500 24px var(--sans); color:var(--accent); letter-spacing:-.03em; }
.journey-facts span { font:11px var(--mono); color:var(--muted); }
.education-entry { background:var(--tile); padding:24px; border:1px solid var(--soft); border-radius:6px; }
.education-entry>.ascii-rule { display:none; }
.journey-list { margin-top:28px; }
.journey-list li { position:relative; border-top:0; padding:22px 0 26px 28px; border-left:1px dashed var(--rule); margin-left:5px; }
.journey-list li::before { content:"+"; position:absolute; left:-5px; top:25px; color:var(--accent); background:var(--paper); font:14px var(--mono); }
.journey-list h3 { margin-top:8px; }
.writing-list { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.writing-item { padding:0 0 24px; background:var(--tile); border:1px solid var(--soft); border-radius:8px; overflow:hidden; }
.writing-item>.ascii-rule { display:none; }
.writing-item .project-visual {height:185px;}
.writing-item>p,.writing-item>h3 { margin-left:20px; margin-right:20px; }
.writing-item .project-context { padding-top:18px; }
.writing-item h3 { font-size:22px; }
.writing-item .article-deck {font:14px/1.8 var(--sans);color:var(--muted);}
.writing-item .article-tags {font:10px var(--mono);color:var(--accent);margin-top:24px;}
.contact { display:grid; grid-template-columns:1.5fr 1fr; gap:24px; position:relative; isolation:isolate; overflow:hidden; padding:48px 32px 24px; }
.footer-sky {position:absolute;right:-60px;top:0;width:65%;height:300px;z-index:-1;color:var(--accent);opacity:.5;}
.footer-sky .space-art {font-size:9px;line-height:9px;}
.footer-sky .visual-label {display:none;}
.contact-copy {grid-column:1;}
.contact h2 {font-size:clamp(32px,4vw,54px);letter-spacing:-.05em;line-height:1.05;margin:20px 0;}
.contact-invitation {font:15px/1.8 var(--sans);color:var(--muted);max-width:42ch;}
.contact-email {font-size:clamp(12px,1.5vw,17px);color:var(--accent);margin:18px 0;overflow-wrap:anywhere;}
.contact-links {grid-column:2;align-self:end;display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.contact-links a {background:var(--surface);border:1px solid var(--soft);padding:14px;font-size:12px;border-radius:4px;}
.back-to-top {grid-column:1/-1;font:11px var(--mono);color:var(--accent);margin-top:14px;}
.footer-line {grid-column:1/-1;flex-wrap:wrap;gap:14px;margin-top:12px;padding-top:20px;}
@media(max-width:1099px) { .page-index {top:auto;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;padding-top:18px;} .page-index>p:first-child {grid-column:1;margin:0;} .page-index nav {grid-column:1/-1;grid-row:2;overflow-x:auto;width:100%;} .index-theme {grid-column:2;grid-row:1;margin:0;padding:0;border:0;} .index-coordinate {display:none;} .hero {padding-top:36px;} }
@media(max-width:680px) { .journey-signal,.writing-list,.contact {grid-template-columns:1fr;} .journey-facts {border-left:0;border-top:1px solid var(--soft);} .contact-links,.contact-copy {grid-column:1;} .contact {padding:28px 18px;} .footer-sky {width:100%;right:-90px;opacity:.25;} .journey-list li {grid-template-columns:1fr;gap:10px;padding-left:20px;} .contact-links a {padding:12px;} }

.writing-item {display:block;}
.writing-item h3 {margin:18px 20px;line-height:1.4;}
.writing-item p:last-child {margin:22px 20px 0;}

/* Quieter hero and compact, icon-led social links. */
.hero h1 {margin-top:0;}
.hero-socials {margin-top:24px;}
.hero-socials>p {font:13px var(--sans);color:var(--muted);margin:0 0 12px;}
.hero-socials strong {color:var(--ink);font-weight:500;}
.hero-socials .hero-actions {display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.hero-socials .hero-actions a,.hero-socials .hero-actions a:first-child {display:inline-flex;align-items:center;gap:8px;border:1px solid var(--soft);background:var(--tile);color:var(--muted);font:12px var(--sans);padding:9px 12px;border-radius:4px;transition:color .2s,border-color .2s,background .2s;}
.hero-socials .hero-actions a:hover,.hero-socials .hero-actions a:focus-visible {color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--paper));text-decoration:none;}
.page-index>p:first-child {font-size:11px;text-transform:uppercase;}
/* Small ASCII vignettes, concise descriptions, and real stack logos. */
.project-grid {grid-template-columns:1fr;gap:0;}
.project {display:grid;grid-template-columns:190px minmax(0,1fr);gap:24px;padding:26px 0;background:transparent;border:0;border-top:1px solid var(--soft);border-radius:0;overflow:visible;}
.project-visual::after {display:none;}
.project>.project-visual {height:175px;border:1px solid var(--soft);border-radius:6px;align-self:center;background:var(--tile);}
.project>.project-visual .space-art {inset:10px 0;font-size:3.7px;line-height:5px;}
.project-body {min-width:0;}
.project-body .project-context {margin:0!important;font-size:9px!important;}
.project-body h3 {font-size:23px;margin:8px 0 6px;}
.project-body p {margin:8px 0;font-size:14px;max-width:75ch;}
.project-body .project-tagline {font-size:15px;}
.project-body .tag-list {gap:6px;margin:15px 0 0;}
.project-body .tag-list li {display:flex;align-items:center;gap:7px;padding:5px 8px;border:1px solid var(--soft);border-radius:4px;font:11px var(--sans);}
.project-body .tag-list li::before,.project-body .tag-list li::after {content:none;}
.project-body .tag-list img {object-fit:contain;background:#f5f3ee;border-radius:3px;padding:1px;}
.project-body .text-link {margin-top:13px;}
.article-thumbnail {display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--soft);background:var(--soft);}
/* Scroll-controlled mission timeline. */
.journey-readout {display:flex;justify-content:space-between;margin-top:32px;padding:12px 0;border-bottom:1px solid var(--soft);color:var(--accent);font:10px var(--mono);letter-spacing:.1em;}
.journey-list {position:relative;--journey-progress:0;}
.journey-list::before {content:"";position:absolute;left:5px;top:0;bottom:0;width:1px;background:var(--accent);transform-origin:top;transform:scaleY(var(--journey-progress));box-shadow:0 0 8px var(--accent);}
.journey-list li {opacity:.62;transition:opacity .4s,transform .4s;}
.journey-list li.milestone-active {opacity:1;transform:translateX(5px);}
.journey-list li.milestone-passed {opacity:.85;}
.journey-list li::before {transition:color .3s,text-shadow .3s;}
.journey-list li.milestone-active::before {content:"@";text-shadow:0 0 8px var(--accent);}
.journey-list li.milestone-active h3 {color:var(--accent);}
@media(max-width:680px){.project {grid-template-columns:90px minmax(0,1fr);gap:14px;padding:22px 0;}.project>.project-visual {height:125px;}.project>.project-visual .space-art {font-size:1.75px;line-height:3.2px;inset:10px 0;}.project-body h3 {font-size:19px;overflow-wrap:anywhere;}.project-body p {font-size:13px;}.project-body .project-context {font-size:8px!important;}.hero-socials .hero-actions a {font-size:11px;padding:8px;}.project-body .tag-list li {font-size:10px;padding:4px;}.project-body .text-link {font-size:11px;}}
@media(prefers-reduced-motion:reduce){.journey-list li {transition:none;}.journey-list li.milestone-active {transform:none;}.hero-socials .hero-actions a {transition:none;}}

/* Compact centered reading shell; index is attached to the content column. */
body {padding-left:0;font-size:13px;}
.content-width {width:min(760px,calc(100% - 48px));}
.page-index {top:64px;width:130px;}
.hero {min-height:450px;padding:56px 0 36px;}
.hero h1 {font-size:86px;line-height:.94;margin:0 0 24px;}
.hero-role {font-size:19px;}
.hero-description {font-size:14px;line-height:1.75;}
.hero-note {font-size:10px;margin-top:25px;}
.hero-socials>p {font-size:12px;}
.hero-socials .hero-actions a,.hero-socials .hero-actions a:first-child {font-size:11px;padding:8px 10px;}
.section,.contact {padding:26px 20px;margin:18px -20px;border-radius:7px;}
.section-heading {margin-bottom:22px;gap:16px;}
.section-heading h2 {font-size:26px;}
.section-aside {font-size:10px;}
.section-intro {font-size:14px;line-height:1.75;margin-bottom:22px;}
.section-description,.data-status {font-size:12px;}
.calendar-months {grid-template-columns:repeat(var(--weeks,53),10px);gap:3px;font-size:9px;height:22px;}
.contribution-grid {grid-template-rows:repeat(7,10px);grid-auto-columns:10px;gap:3px;line-height:10px;}
.contribution-cell {width:10px;height:10px;}
.calendar-panel {padding:4px 0;margin-bottom:0;}
.calendar-legend i {width:10px;height:10px;}
.calendar-panel figcaption {font-size:9px;}
.pr-filters button {font-size:10px;padding:5px 7px;min-height:30px;}
.pr-row h3 {font-size:16px;}
.project {grid-template-columns:145px minmax(0,1fr);gap:20px;padding:22px 0;}
.project>.project-visual {height:145px;}
.project>.project-visual .space-art {font-size:2.8px;line-height:4px;}
.project-body h3 {font-size:20px;margin:7px 0;}
.project-body p {font-size:13px;line-height:1.7;}
.project-body .project-tagline {font-size:14px;}
.project-body .text-link {font-size:11px;}
.tech-tiles li {padding:9px;gap:7px;font-size:11px;}
.tech-tiles img {width:25px;height:25px;}
.skill-grid {gap:22px;}
.journey-signal .project-visual {height:170px;}
.journey-signal .space-art {font-size:5px;line-height:5px;}
.journey-facts {padding:18px;gap:14px;}
.journey-facts strong {font-size:20px;}
.journey-facts span {font-size:10px;}
.education-entry {padding:20px;}
.education-entry h3,.journey-list h3 {font-size:18px;}
.journey-list p,.education-entry>p:last-child {font-size:13px;}
.journey-list li {grid-template-columns:100px 1fr;gap:20px;}
.writing-list {gap:18px;}
.writing-item h3 {font-size:19px;}
.writing-item .article-deck {font-size:13px;}
.writing-item>p,.writing-item>h3 {margin-left:16px;margin-right:16px;}
.contact {padding:34px 24px 20px;gap:20px;}
.contact h2 {font-size:38px;}
.contact-invitation {font-size:13px;}
.contact-email {font-size:13px;}
.contact-links a {font-size:11px;padding:11px;}
.footer-sky .space-art {font-size:7px;line-height:7px;}
.ambient-field #ascii-rain {position:absolute;inset:0;width:100vw;height:100vh;opacity:1;filter:none;}
/* Light uses dark copper ink, avoiding washed-out gold on white. */
@media(min-width:1100px){
 main.content-width {margin-left:calc(50% - 310px);margin-right:0;}
 .page-index {left:calc(50% - 490px);}
}
@media(max-width:1099px){
 .page-index {top:auto;max-width:760px;width:calc(100% - 48px);}
 .section,.contact {margin:18px 0;}
 .hero {padding-top:30px;}
}
@media(max-width:680px){
 .content-width,.page-index {width:calc(100% - 32px);}
 .hero {min-height:0;padding:32px 0 28px;}
 .hero h1 {font-size:66px;}
 .hero-role {font-size:18px;}
 .section,.contact {padding:22px 15px;}
 .section-heading h2 {font-size:23px;}
 .project {grid-template-columns:80px minmax(0,1fr);gap:12px;}
 .project>.project-visual {height:110px;}
 .project>.project-visual .space-art {font-size:1.55px;line-height:3px;}
 .project-body h3 {font-size:17px;}
 .project-body p {font-size:12px;}
 .project-body .project-tagline {font-size:13px;}
 .journey-list li {grid-template-columns:1fr;gap:8px;}
 .journey-signal .project-visual {height:155px;}
 .contact h2 {font-size:31px;}
}

/* Saturated ember is rendered as ink directly, without grayscale/darkening filters. */
.content-width {width:min(680px,calc(100% - 48px));}
.hero h1 {font-size:78px;}
.hero {min-height:425px;}
.calendar-months {grid-template-columns:repeat(var(--weeks,53),9px);}
.contribution-grid {grid-template-rows:repeat(7,9px);grid-auto-columns:9px;line-height:9px;}
.contribution-cell {width:9px;height:9px;}
.project {grid-template-columns:125px minmax(0,1fr);gap:18px;}
.project>.project-visual {height:135px;}
.project>.project-visual .space-art {font-size:2.4px;line-height:3.7px;}
.pr-meta {flex-wrap:wrap;row-gap:5px;}
.section-aside {overflow-wrap:anywhere;}
.contact-email {overflow-wrap:anywhere;}
.tech-tiles li {max-width:100%;}
.article-thumbnail {max-width:100%;}
@media(min-width:1100px){main.content-width {margin-left:calc(50% - 270px);} .page-index {left:calc(50% - 450px);}}
@media(max-width:1099px){.page-index {max-width:680px;}}
@media(max-width:680px){
 .content-width,.page-index {width:calc(100% - 32px);}
 .hero h1 {font-size:clamp(56px,15vw,72px);}
 .hero {min-height:0;}
 .section-heading {align-items:flex-start;}
 .section-heading h2 {font-size:clamp(21px,5.8vw,25px);}
 .project {grid-template-columns:1fr;gap:14px;}
 .project>.project-visual {height:120px;width:100%;}
 .project>.project-visual .space-art {font-size:3.7px;line-height:3.8px;}
 .project-body h3 {font-size:20px;}
 .project-body p {font-size:13px;}
 .project-body .project-tagline {font-size:14px;}
 .journey-list li {grid-template-columns:1fr;}
 .contact h2 {font-size:clamp(27px,8vw,34px);}
 .contact-links {grid-template-columns:1fr 1fr;}
 .footer-line {font-size:9px;line-height:1.7;}
}
@media(max-width:360px){
 .content-width,.page-index {width:calc(100% - 24px);}
 .section,.contact {padding:20px 12px;}
 .hero-role {font-size:17px;}
 .hero-description {font-size:13px;}
 .hero-socials .hero-actions {gap:6px;}
 .hero-socials .hero-actions a,.hero-socials .hero-actions a:first-child {padding:8px;font-size:11px;}
 .journey-facts div {gap:8px;}
 .pr-filters {gap:0;}
 .pr-filters button {padding:5px;}
}

/* Dark-only portfolio. Open-source rain is a distinct, visible local layer. */
:root {color-scheme:dark;--paper:#111110;--ink:#f4f1eb;--muted:#c0bbb3;--rule:#77726b;--soft:#302e2a;--accent:#f5a16f;--surface:rgba(17,17,16,.72);--tile:rgba(35,33,30,.74);}
#open-source {isolation:isolate;background:rgba(14,19,16,.84);}
#oss-rain {position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;user-select:none;}
#open-source>:not(canvas) {position:relative;z-index:1;}
#open-source .pr-list {background:rgba(17,17,16,.72);border-radius:4px;}
#open-source .section-heading {background:linear-gradient(90deg,rgba(14,19,16,.85),transparent);}
.page-index nav {margin-bottom:0;}
@media(max-width:1099px){.page-index {display:block;} .page-index nav {margin-top:12px;} }

/* Ember rain and transparent contribution filters. */
#open-source {background:var(--surface);}
#open-source .section-heading {background:none;}
.pr-filters,.pr-filters button,.pr-filters button[aria-pressed="true"] {background:transparent;border-color:transparent;box-shadow:none;}
.pr-filters button[aria-pressed="true"] {color:var(--accent);font-weight:700;}
.pr-filters button:hover {color:var(--accent);}

/* Let the open-source activity card sit lightly over the ambient scene. */
#open-source {background:rgba(14,19,16,.34);backdrop-filter:none;}
#open-source .pr-list {background:rgba(17,17,16,.32);backdrop-filter:blur(1px) saturate(1.04);}

/* Compact icons and tighter technology chips throughout the portfolio. */
.tech-tiles img {width:18px;height:18px;padding:2px;border-radius:3px;flex-shrink:0;}
.tech-symbol {width:18px;height:18px;font-size:9px;flex-shrink:0;}
.tech-tiles li {padding:6px 8px;gap:6px;font-size:10px;}
.tech-tiles {gap:6px;}
.skill-group h3 {font-size:11px;margin-bottom:10px;}
.skill-grid {gap:20px;}
.project-body .tag-list img {width:14px;height:14px;padding:1px;}
.project-body .tag-list li {padding:4px 6px;gap:5px;font-size:10px;}
.hero-socials .hero-actions svg {width:12px;height:12px;flex-shrink:0;}
@media(max-width:680px){.tech-tiles img {width:16px;height:16px;}.tech-symbol {width:16px;height:16px;font-size:8px;}.tech-tiles li {padding:6px 7px;}.hero-socials .hero-actions svg {width:11px;height:11px;}}

/* Neutral white structure, with ember reserved for selected accents. */
:root,:root[data-theme="dark"] {--soft:rgba(255,255,255,.16);--rule:rgba(255,255,255,.4);--muted:#c7c6c2;}
.section,.contact {border-color:rgba(255,255,255,.25);}
.tech-tiles li,.writing-item,.education-entry,.journey-signal,.contact-links a {border-color:rgba(255,255,255,.24);}
.project {grid-template-columns:minmax(0,1fr);border-top-color:rgba(255,255,255,.23);}
.project-body .project-context {color:#bdbfbd!important;}
.project-body .text-link,.writing-item .article-tags,.back-to-top {color:var(--ink);}
.project-body .text-link:hover,.back-to-top:hover {color:var(--accent);}
.hero-description {background:rgba(17,17,16,.76);border-left:2px solid rgba(255,255,255,.65);padding:12px 16px;width:fit-content;max-width:100%;color:#f4f1eb;backdrop-filter:blur(2px) saturate(1.08);}
.hero-description p {background:none;}
.hero-description p:first-child {margin-top:0;}
.hero-description p:last-child {margin-bottom:0;}
.hero-socials {background:rgba(17,17,16,.76);border:1px solid rgba(255,255,255,.23);padding:12px;width:fit-content;max-width:100%;border-radius:5px;backdrop-filter:blur(2px) saturate(1.08);}
.hero-socials>p {color:#d6d5d0;}
.hero-socials .hero-actions a,.hero-socials .hero-actions a:first-child {color:#e2e1dc;border-color:rgba(255,255,255,.32);background:rgba(17,17,16,.74);}
.hero-socials .hero-actions a:is(:hover,:focus-visible) {color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,#111110);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 18%,transparent);text-decoration:none;}
html[data-portfolio-theme="cyberpunk-city"] .hero-description,
html[data-portfolio-theme="cyberpunk-city"] .hero-socials {background:rgba(8,14,23,.64);border-color:rgba(117,223,255,.34);}
html[data-portfolio-theme="cyberpunk-city"] .hero-socials .hero-actions a,
html[data-portfolio-theme="cyberpunk-city"] .hero-socials .hero-actions a:first-child {background:rgba(8,14,23,.70);}
html[data-portfolio-theme="cyberpunk-city"] .hero-socials .hero-actions a:is(:hover,:focus-visible) {color:#80e7ff;border-color:#ff82ae;background:rgba(45,21,39,.95);box-shadow:0 0 12px #42bfff24;}
.hero-role,.hero-note {text-shadow:0 1px 5px #000,0 0 12px #000;}
.hero-note {color:#d2d1ca;}
@media(max-width:680px){.project {grid-template-columns:minmax(0,1fr);}.hero-description {padding:11px 13px;}}

/* Space-inspired typography with a readable technical voice. */
:root {--sans:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;--heading:"Space Grotesk","IBM Plex Sans",Arial,sans-serif;--mono:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;}
h1,h2,h3,.hero h1,.section-heading h2,.contact h2,.writing-item h3,.pr-row h3 {font-family:var(--heading);}
.hero h1 {font-weight:500;letter-spacing:-.065em;}
.section-heading h2,.contact h2 {font-weight:500;letter-spacing:-.04em;}
.project-body h3,.writing-item h3,.journey-list h3 {font-weight:500;letter-spacing:-.025em;}
.hero-role {font-family:var(--heading);font-weight:400;letter-spacing:-.025em;}
.hero-description {font-family:var(--sans);letter-spacing:.005em;}
.project-body p,.section-intro,.contact-invitation {letter-spacing:.005em;}
.page-index {font-size:11px;}
.page-index>p:first-child {letter-spacing:.16em;}

/* Quiet depth and scroll choreography; reading content settles fully sharp. */
:root {--read-progress:0;}
.reading-progress {position:fixed;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,#f2eee7 0%,#f2eee7 80%,var(--accent));transform:scaleX(var(--read-progress));transform-origin:left;z-index:20;pointer-events:none;opacity:.7;}
.ambient-field {filter:none;}
.section,.contact {box-shadow:0 10px 36px rgba(0,0,0,.12);transition:border-color .3s,box-shadow .3s;}
.section:hover,.contact:hover {border-color:rgba(255,255,255,.38);box-shadow:0 14px 40px rgba(0,0,0,.2);}
.section-heading h2 {text-wrap:balance;}
.project {position:relative;transition:background .25s,box-shadow .25s;}
.project:hover,.project:focus-within {background:rgba(255,255,255,.025);box-shadow:inset 2px 0 rgba(255,255,255,.45);}
.project-body {padding:0 8px;}
.project-body h3 {transition:color .25s;}
.project:hover h3 {color:#fff;}
.text-link {text-underline-offset:5px;}
.text-link:hover {text-decoration:underline;}
.writing-item {transition:border-color .3s,box-shadow .3s;}
.writing-item:hover,.writing-item:focus-within {border-color:rgba(255,255,255,.52);box-shadow:0 8px 28px rgba(0,0,0,.2);}
.article-thumbnail {transition:filter .4s;filter:saturate(.88);}
.writing-item:hover .article-thumbnail,.writing-item:focus-within .article-thumbnail {filter:saturate(1);}
.contact-links a {transition:border-color .25s,background .25s;}
.contact-links a:hover,.contact-links a:focus-visible {border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.04);text-decoration:none;}
.page-index a {transition:color .2s;}
.page-index a[aria-current] {text-decoration:none;color:#fff;}
.page-index a::before {transition:opacity .25s;}
.reveal-in {animation:focus-arrive .7s cubic-bezier(.2,.65,.3,1) both;}
.hero h1 {animation:focus-arrive .9s cubic-bezier(.2,.65,.3,1) both;}
@keyframes focus-arrive {from {opacity:.4;filter:blur(5px);transform:translateY(12px);} to {opacity:1;filter:blur(0);transform:translateY(0);}}
@media(hover:none){.section:hover,.contact:hover {box-shadow:0 10px 36px rgba(0,0,0,.12);}.project:hover {background:transparent;box-shadow:none;}}
@media(prefers-reduced-motion:reduce){.ambient-field {filter:none;}.reveal-in,.hero h1 {animation:none;}.section,.contact,.project,.writing-item,.article-thumbnail,.contact-links a,.page-index a {transition:none;}}

/* Keep the section index on the left at the live preview's desktop width. */
@media (min-width:850px) {
  body { padding-left:0; }
  .page-index {
    position:fixed;
    top:72px;
    left:max(16px,calc(50% - 420px));
    width:130px;
    max-width:none;
    margin:0;
    overflow:visible;
    display:block;
    grid-template-columns:none;
    align-items:initial;
    gap:0;
    padding-top:0;
  }
  .page-index>p:first-child { grid-column:auto; margin:0 0 22px; }
  .page-index nav {
    display:grid;
    grid-column:auto;
    grid-row:auto;
    gap:18px;
    width:auto;
    overflow:visible;
    margin-top:0;
    padding-bottom:0;
  }
  .page-index a { padding-left:20px; white-space:normal; }
  .index-theme { grid-column:auto; grid-row:auto; margin:30px 0 0; padding:22px 0 0; border-top:1px dashed var(--rule); }
  .index-coordinate { display:block; }
  main.content-width { margin-left:calc(50% - 260px); margin-right:0; }
}
@media (max-width:849px) {
  .page-index { position:relative; top:auto; left:auto; }
  main.content-width { margin-left:auto; margin-right:auto; }
}

/* A warm ember pass gives each project row a distinct, tactile hover state. */
.project {
  transition:translate .34s cubic-bezier(.2,.8,.2,1),background .32s ease,box-shadow .34s ease,border-color .32s ease;
}
.project::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:54px;
  height:2px;
  opacity:0;
  pointer-events:none;
  z-index:2;
  background:linear-gradient(90deg,transparent,var(--accent) 34%,#ffd3ad 68%,transparent);
  filter:drop-shadow(0 0 5px var(--accent));
}
.project:is(:hover,:focus-within) {
  translate:3px 0;
  border-top-color:color-mix(in srgb,var(--accent) 68%,transparent);
  background:radial-gradient(ellipse at 4% 50%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 62%),rgba(255,255,255,.012);
  box-shadow:inset 2px 0 var(--accent),0 7px 24px rgba(0,0,0,.24),0 0 26px color-mix(in srgb,var(--accent) 9%,transparent);
}
.project:is(:hover,:focus-within)::before { animation:project-ember-pass .9s cubic-bezier(.15,.65,.25,1) both; }
.project:is(:hover,:focus-within) .project-context { color:var(--accent)!important; transition:color .24s ease; }
.project:is(:hover,:focus-within) h3 { color:var(--accent); text-shadow:0 0 16px color-mix(in srgb,var(--accent) 34%,transparent); transition:color .24s ease,text-shadow .3s ease; }
@keyframes project-ember-pass {
  0% { left:-54px; opacity:0; }
  14% { opacity:1; }
  84% { opacity:1; }
  100% { left:calc(100% + 54px); opacity:0; }
}
@media(hover:none) {
  .project:hover:not(:focus-within) { translate:none; border-top-color:rgba(255,255,255,.23); background:transparent; box-shadow:none; }
  .project:hover:not(:focus-within)::before { animation:none; opacity:0; }
  .project:hover:not(:focus-within) .project-context { color:#bdbfbd!important; }
  .project:hover:not(:focus-within) h3 { color:inherit; text-shadow:none; }
}
@media(prefers-reduced-motion:reduce) {
  .project { transition:none; }
  .project::before { animation:none!important; opacity:0; }
  .project:is(:hover,:focus-within) { translate:none; }
  .project:is(:hover,:focus-within) h3 { text-shadow:none; }
}

.page-index-play {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
  margin-top:26px;
  padding:9px 10px;
  border:1px solid color-mix(in srgb,var(--accent) 40%,var(--rule));
  background:rgba(255,255,255,.018);
  color:var(--accent);
  font:10px/1.2 var(--mono);
  letter-spacing:.05em;
  text-align:left;
  cursor:pointer;
  transition:background .24s,border-color .24s,box-shadow .24s,translate .24s;
}
.page-index-play span {font-size:13px;transition:translate .24s;}
.page-index-play:hover,.page-index-play:focus-visible {
  border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 9%,transparent);
  box-shadow:0 0 18px color-mix(in srgb,var(--accent) 16%,transparent);
  translate:0 -2px;
}
.page-index-play:hover span,.page-index-play:focus-visible span {translate:2px -2px;}
.page-index-play:focus-visible {outline:2px solid #ffd0ae;outline-offset:3px;}
@media(prefers-reduced-motion:reduce) {
  .page-index-play,.page-index-play span {transition:none;}
  .page-index-play:hover,.page-index-play:focus-visible {translate:none;}
  .page-index-play:hover span,.page-index-play:focus-visible span {translate:none;}
}

/* Compact repository links and a filled selection replace the bracket treatment. */
.contribution-badges { display:flex;flex-wrap:wrap;gap:8px;margin:18px 0; }
.contribution-badge { display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 10px;border:1px solid var(--rule);border-radius:6px;background:var(--reading-surface);color:var(--ink);font:11px/1.5 var(--mono);text-decoration:none; }
.contribution-badge img { border-radius:4px;object-fit:contain;flex-shrink:0; }
.contribution-badge .badge-arrow { color:var(--muted);font-size:12px; }
.contribution-badge:hover,.contribution-badge:focus-visible { border-color:var(--accent);color:var(--accent);text-decoration:none; }
#open-source .pr-filters { display:flex;gap:3px;padding:4px;border:1px solid var(--soft);border-radius:8px;background:rgba(0,0,0,.26); }
#open-source .pr-filters button { min-height:34px;padding:7px 12px;border:1px solid transparent;border-radius:5px;color:var(--muted);font:11px/1.4 var(--mono); }
#open-source .pr-filters button::before,#open-source .pr-filters button::after { content:none; }
#open-source .pr-filters button:hover { color:var(--ink);background:rgba(255,255,255,.06); }
#open-source .pr-filters button[aria-pressed="true"] { background:var(--accent);border-color:var(--accent);color:#111110;font-weight:600;box-shadow:0 1px 3px #0004; }
#open-source .pr-filters button:focus-visible { outline:2px solid var(--ink);outline-offset:2px; }
@media(max-width:400px) { #open-source .section-heading { flex-wrap:wrap; } }

/* Contact actions stay compact and inherit the active scene's accent. */
.hero-contact-actions { display:flex;flex-wrap:wrap;gap:8px;margin-top:12px; }
.hero-contact-actions a,.hero-contact-actions button,.booking-submit {
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:38px;padding:7px 11px;border:1px solid var(--soft);border-radius:3px;
  background:rgba(17,17,16,.68);color:var(--ink);font:10px/1.4 var(--mono);cursor:pointer;text-decoration:none;
}
.hero-contact-actions button,.booking-submit { border-color:var(--accent);color:var(--accent); }
.hero-contact-actions :is(a,button):hover,.booking-submit:hover { background:color-mix(in srgb,var(--accent) 12%,#111110);border-color:var(--accent);color:var(--accent); }
.more-projects { margin-top:16px;border-top:1px solid var(--soft); }
.more-projects summary { padding:18px 8px;cursor:pointer;font:13px/1.6 var(--mono);color:var(--ink); }
.more-projects summary span { margin-left:12px;font-size:11px;color:var(--muted); }
.more-projects[open] summary { color:var(--accent); }
.project-body .project-status { padding-left:12px;border-left:1px solid var(--accent);color:var(--muted);font:11px/1.8 var(--mono); }
.project-evidence { display:flex;flex-wrap:wrap;gap:8px 22px; }
.booking-dialog { width:min(440px,calc(100vw - 32px));max-height:calc(100svh - 32px);margin:auto;padding:0;overflow:auto;border:1px solid var(--soft);background:#111212;color:var(--ink);border-radius:6px; }
.booking-dialog::backdrop { background:#000b; }
.booking-panel { padding:24px; }
.booking-panel .theme-dialog-header h2 { font:20px/1.4 var(--sans); }
.booking-panel p { color:var(--muted);font:12px/1.7 var(--sans); }
.booking-panel form { display:grid;gap:16px;margin-top:20px; }
.booking-panel label { display:grid;gap:7px;min-width:0;color:var(--ink);font:11px/1.5 var(--mono); }
.booking-time-fields { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.booking-panel :is(input,select,textarea) { box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:10px;border:1px solid var(--soft);border-radius:3px;background:#1c1d1d;color:var(--ink);font:13px/1.5 var(--sans);color-scheme:dark; }
.booking-panel textarea { resize:vertical; }
.booking-panel :is(input,select,textarea):focus-visible { outline:2px solid var(--accent);outline-offset:2px; }
.booking-panel #booking-error { margin:0;color:#ffaaa0; }
.booking-panel #booking-error:empty { display:none; }
.booking-fallback { margin:18px 0 0;overflow-wrap:anywhere; }
.booking-fallback a { color:var(--accent); }
@media(max-width:400px) { .booking-panel { padding:18px; }.booking-time-fields { grid-template-columns:1fr; }.more-projects summary span { display:block;margin:4px 0 0; } }

/* The city is sampled from the supplied image and rendered as live ASCII. */
.ambient-field #ambient-city {
  display:none;
  inset:0;
  left:0;
  width:100vw;
  height:100svh;
  opacity:0;
  mix-blend-mode:screen;
}
html[data-portfolio-theme="cyberpunk-city"] .ambient-field canvas:not(#ambient-city) { display:none; }
html[data-portfolio-theme="cyberpunk-city"] .ambient-field #ambient-city { display:block; opacity:.80; }
:root[data-theme="dark"][data-portfolio-theme="cyberpunk-city"] { --accent:#ff829e; --muted:#b7c6d1; --ember-0:#193247; --ember-1:#175f78; --ember-2:#168ca2; --ember-3:#b94f85; --ember-4:#ff92a8; }
html[data-portfolio-theme="cyberpunk-city"] .page-index a[aria-current],
html[data-portfolio-theme="cyberpunk-city"] .page-index a:hover { color:#ecfaff; }
html[data-portfolio-theme="cyberpunk-city"] .page-index a[aria-current]::before { color:#65efff; }
html[data-portfolio-theme="cyberpunk-city"] .theme-toggle { border-color:rgba(101,239,255,.5); color:#8af4ff; }
html[data-portfolio-theme="cyberpunk-city"] .page-index::before { content:"";position:absolute;inset:-14px -10px;z-index:-1;background:rgba(8,11,17,.76); }

.page-index #theme-toggle { margin:22px 0 0;padding:8px;font-size:9px;min-height:32px;white-space:nowrap; }
.page-index #blackhole-play { margin-top:10px;white-space:nowrap;font-size:9px;padding:8px; }
#blackhole-play[hidden],html[data-portfolio-theme="cyberpunk-city"] #blackhole-play { display:none; }

.theme-dialog { width:min(340px,calc(100vw - 32px));max-width:none;max-height:calc(100svh - 32px);margin:auto;padding:0;overflow:auto;color:var(--ink);border:1px solid #393a3b;background:#111212;box-shadow:0 20px 80px #0008; }
.theme-dialog::backdrop { background:#0009;backdrop-filter:none; }
.theme-dialog-panel { padding:16px; }
.theme-dialog-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:12px; }
.theme-dialog-header h2 { margin:0;font:12px/1.5 var(--mono);font-weight:500; }
.theme-dialog-close { display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;background:none;color:var(--muted);font:20px/1 var(--mono);cursor:pointer; }
.theme-dialog-close:hover { color:var(--accent); }
.theme-options { display:grid;gap:4px; }
.theme-option { display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:10px 12px;border:1px solid transparent;background:none;color:var(--ink);text-align:left;font:12px/1.5 var(--mono);cursor:pointer;transition:background .18s,border-color .18s; }
.theme-option:hover,.theme-option:focus-visible { background:#ffffff08;border-color:#ffffff24; }
.theme-option[aria-pressed="true"] { background:#ffffff05;border-color:#ffffff18; }
.theme-option small { color:#858785;font:9px/1 var(--mono); }
.theme-swatch { flex:0 0 auto;width:24px;height:18px;border:1px solid #ffffff24; }
.theme-swatch-hole { background:linear-gradient(90deg,#171310 50%,#f5a16f 50%); }
.theme-swatch-cyberpunk { background:linear-gradient(90deg,#55cfff 50%,#ff79ad 50%); }
.theme-choice-mark { visibility:hidden;margin-left:auto;color:var(--accent);font-size:12px; }
.theme-option[aria-pressed="true"] .theme-choice-mark { visibility:visible; }
.theme-option:focus-visible,.theme-dialog-close:focus-visible { outline:1px solid var(--accent);outline-offset:2px; }
@media(prefers-reduced-motion:reduce) { .theme-option { transition:none; } }

/* A short horizon reveal avoids filtering two full-screen snapshots. */
::view-transition-old(root) {animation:theme-depart .45s ease-out both;}
::view-transition-new(root) {animation:theme-arrive .65s cubic-bezier(.18,.72,.2,1) both;mix-blend-mode:normal;}
@keyframes theme-depart {to{opacity:0;}}
@keyframes theme-arrive {from{clip-path:circle(0% at 50% 46%);}to{clip-path:circle(150% at 50% 46%);}}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none;}}

.ambient-field #ambient-sunset,.ambient-field #ambient-fish {display:none;inset:0;width:100vw;height:100svh;opacity:1;mix-blend-mode:normal;}
html[data-portfolio-theme="sunset"] .ambient-field canvas,html[data-portfolio-theme="fish"] .ambient-field canvas {display:none;}
html[data-portfolio-theme="sunset"] .ambient-field #ambient-sunset,html[data-portfolio-theme="fish"] .ambient-field #ambient-fish {display:block;}
:root[data-theme="dark"][data-portfolio-theme="sunset"] {--accent:#ff665e;--muted:#d1b4ad;--ember-0:#371d27;--ember-1:#762d36;--ember-2:#b63e46;--ember-3:#ff665e;--ember-4:#ffe3c3;}
:root[data-theme="dark"][data-portfolio-theme="fish"] {--accent:#efbb62;--muted:#b3cdc3;--ember-0:#082c27;--ember-1:#155543;--ember-2:#317a5e;--ember-3:#c99945;--ember-4:#f6d48b;}
html[data-portfolio-theme="sunset"] .page-index::before,html[data-portfolio-theme="fish"] .page-index::before {content:"";position:absolute;inset:-14px -10px;z-index:-1;background:#090d10c9;}
html[data-portfolio-theme="sunset"] .hero-description,html[data-portfolio-theme="fish"] .hero-description {background:#080d10c8;padding:14px 16px;}
html[data-portfolio-theme="sunset"] .section,html[data-portfolio-theme="fish"] .section {background:#0a1013bd;}
.theme-swatch-sunset {background:linear-gradient(90deg,#ff454d 50%,#ffe5c7 50%);}
.theme-swatch-fish {background:linear-gradient(90deg,#08634d 50%,#e9ad45 50%);}

/* Let the changing scene breathe through both writing cards and their section. */
#writing.section {background:rgba(7,10,12,.24);backdrop-filter:none;}
.writing-item {position:relative;background:linear-gradient(140deg,rgba(255,255,255,.045),rgba(8,11,13,.16) 42%,rgba(4,6,8,.22));border-color:color-mix(in srgb,var(--accent) 38%,rgba(255,255,255,.1));backdrop-filter:blur(1px) saturate(1.04);box-shadow:inset 0 1px rgba(255,255,255,.06),0 10px 28px rgba(0,0,0,.1);transition:background .3s,border-color .3s,box-shadow .3s,transform .3s;}
.writing-item::before {content:"";position:absolute;z-index:1;top:0;left:22px;width:76px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 11px color-mix(in srgb,var(--accent) 65%,transparent);pointer-events:none;}
.writing-item .project-context {color:var(--accent);opacity:.9;}
.writing-item:hover,.writing-item:focus-within {background:linear-gradient(140deg,rgba(255,255,255,.07),rgba(8,11,13,.12) 42%,rgba(4,6,8,.17));border-color:color-mix(in srgb,var(--accent) 68%,rgba(255,255,255,.18));box-shadow:inset 0 1px rgba(255,255,255,.12),0 14px 34px rgba(0,0,0,.18),0 0 24px color-mix(in srgb,var(--accent) 15%,transparent);transform:translateY(-3px);}

/* Keep the visitor silhouettes visible over each non-black-hole canvas. */
html[data-portfolio-theme="cyberpunk-city"] .ambient-field canvas#ambient-matter,
html[data-portfolio-theme="sunset"] .ambient-field canvas#ambient-matter,
html[data-portfolio-theme="fish"] .ambient-field canvas#ambient-matter {display:block;opacity:.96;mix-blend-mode:screen;}
.footer-sky[data-scene="cyberpunk-city"] {color:#75dfff;text-shadow:2px 0 #ff7aa855;}
.footer-sky[data-scene="sunset"] {color:#ff756d;text-shadow:0 0 12px #ff594555;}
.footer-sky[data-scene="fish"] {color:#e7bd68;text-shadow:0 0 10px #61c9a244;}
@media(prefers-reduced-motion:reduce){.writing-item,.writing-item:hover,.writing-item:focus-within{transition:none;transform:none;}}

.journey-signal {background:rgba(7,10,12,.18);border-color:color-mix(in srgb,var(--accent) 25%,transparent);}
.journey-signal .project-visual {background:transparent;backdrop-filter:blur(1px) saturate(1.04);}

/* Keep a consistent reading surface over the brightest ASCII scenes. */
:root {
  --reading-surface:rgba(17,17,16,.68);
  --reading-tile:rgba(12,14,16,.18);
}
html[data-portfolio-theme="cyberpunk-city"] {
  --reading-surface:rgba(8,14,23,.68);
  --reading-tile:rgba(8,14,23,.20);
}
html[data-portfolio-theme] .section,
html[data-portfolio-theme] .contact,
#open-source.section,#writing.section {
  background:var(--reading-surface);
}
html[data-portfolio-theme] .hero-description,
html[data-portfolio-theme] .hero-socials,
html[data-portfolio-theme] .page-index::before {
  background:var(--reading-surface);
}
.page-index::before {content:"";position:absolute;inset:-14px -10px;z-index:-1;}
#open-source .pr-list,
.writing-item,.writing-item:hover,.writing-item:focus-within,
.journey-signal,.education-entry,.tech-tiles li,
.contact-links a,.contact-links a:hover,.contact-links a:focus-visible {
  background:var(--reading-tile);
}
html[data-portfolio-theme] .hero-socials .hero-actions a,
.hero-contact-actions a,.hero-contact-actions button {
  background:var(--reading-surface);
}

/* Let the visitor view the animated theme as a full-screen scene. */
.page-index #no-ui-toggle { margin-top:8px; }
.page-index #no-ui-toggle { color:var(--muted);border-color:var(--soft);background:rgba(255,255,255,.018); }
.page-index #no-ui-toggle:hover,.page-index #no-ui-toggle:focus-visible { color:var(--accent);border-color:color-mix(in srgb,var(--accent) 55%,var(--soft));background:color-mix(in srgb,var(--accent) 6%,transparent); }
body[data-no-ui="true"] > :not(.ambient-field):not(#no-ui-return) { display:none !important; }
.no-ui-return {
  position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:120;
  display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:32px;padding:5px 9px;
  border:1px solid color-mix(in srgb,var(--accent) 36%,rgba(255,255,255,.2));border-radius:2px;
  background:rgba(5,8,10,.28);color:var(--accent);
  font:10px/1.4 var(--mono);letter-spacing:.025em;cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,.12);transition:background .18s,border-color .18s,color .18s;
}
.no-ui-return::before { content:"[ ";color:color-mix(in srgb,var(--accent) 66%,transparent); }
.no-ui-return::after { content:" ]";color:color-mix(in srgb,var(--accent) 66%,transparent); }
.no-ui-return:hover { background:color-mix(in srgb,var(--accent) 9%,rgba(5,8,10,.28));border-color:color-mix(in srgb,var(--accent) 66%,transparent);color:var(--ink); }
.no-ui-return:focus-visible { outline:1px dashed var(--accent);outline-offset:3px; }
.no-ui-return[hidden] { display:none !important; }
@media(prefers-reduced-motion:reduce) { .no-ui-return { transition:none; } }

/* Timeline dates read as small markers along the event line. */
.journey-list time {
  display:inline-flex;align-items:center;align-self:start;height:max-content;width:max-content;max-width:100%;
  padding:5px 8px;border:1px solid color-mix(in srgb,var(--accent) 34%,var(--soft));border-radius:3px;
  background:color-mix(in srgb,var(--accent) 8%,var(--reading-surface));color:var(--accent);
  box-shadow:inset 2px 0 var(--accent);font:500 9px/1.5 var(--mono);letter-spacing:.06em;
}

/* Show the full education path as one compact, readable record. */
.education-entry { padding:20px 24px; }
.education-entry .education-heading { margin:0 0 8px;color:var(--accent); }
.education-history { display:grid; }
.education-stage { display:grid;grid-template-columns:100px minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px 0;border-top:1px solid var(--soft); }
.education-period { color:var(--accent);font:10px/1.5 var(--mono);white-space:nowrap; }
.education-detail .project-context { margin:0 0 3px;font-size:9px!important;letter-spacing:.08em; }
.education-detail h3 { margin:0;font:500 14px/1.4 var(--sans); }
.education-detail>p:last-child { margin:3px 0 0;font:11px/1.5 var(--sans);color:var(--muted); }
.education-result { color:var(--accent);font:10px/1.5 var(--mono);white-space:nowrap; }
@media(max-width:680px) {
  .education-entry { padding:18px 16px; }
  .education-stage { grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:5px 12px; }
  .education-detail { grid-column:1/-1; }
}

/* Keep wheel, touch, and keyboard scrolling; hide scrollbar tracks on every surface. */
* {
  scrollbar-width: none !important;
  scrollbar-gutter: auto !important;
  -ms-overflow-style: none !important;
}
*::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}