@font-face{
  font-family:Inter;
  src:url("/static/core/fonts/inter-latin-core-variable.3b0c825b58ea.woff2") format('woff2');
  font-weight:100 900;
  font-display:swap
}

@font-face{
  font-family:JetBrains Mono;
  src:url("/static/core/fonts/jetbrains-mono-variable.a0ac8a42394c.woff2") format('woff2');
  font-weight:100 800;
  font-display:swap
}

:root{
  color-scheme:dark;
  --bg:#090b10;
  --panel:#10131a;
  --text:#d9deea;
  --dim:#7f899b;
  --line:#252b38;
  --signal:#8ba4d8;
  --link:#6ea0ff;
  --amber:#c7a26a;
  --side-header:#131720;
  --hover:#151923;
  --filter-surface:#151a24;
  --filter-focus:#202a3a;
  --error:#ff6b6b
}

:root[data-theme=light]{
  color-scheme:light;
  --bg:#eef1f5;
  --panel:#f8f9fb;
  --text:#182131;
  --dim:#5d6879;
  --line:#cbd3df;
  --signal:#3d5f9b;
  --link:#245fca;
  --amber:#986d2d;
  --side-header:#edf0f4;
  --hover:#e4e9f0;
  --filter-surface:#e3e8f0;
  --filter-focus:#d1dbe9;
  --error:#b42318
}

*{
  box-sizing:border-box
}
html{
  max-width:100%;
  scrollbar-gutter:stable
}
body{
  max-width:100%;
  margin:0;
  background-color:var(--bg);
  background-attachment:fixed;
  color:var(--text);
  font:14px/1.55 'JetBrains Mono',ui-monospace,monospace
}
a{
  color:inherit;
  text-decoration:none
}
a:hover{
  color:var(--text)
}
img{
  max-width:100%
}
.skip-link{
  position:fixed;
  top:8px;
  left:8px;
  z-index:100;
  padding:8px 12px;
  background:var(--panel);
  border:1px solid var(--line);
  transform:translateY(-150%)
}
.skip-link:focus{
  transform:none
}
.shell{
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  width:100%;
  min-height:100vh;
  margin:0;
  padding:0 22px 22px
}
.workspace,.messages,.status{
  width:min(100%,calc(1400px - 44px));
  margin-inline:auto
}
.top{
  position:sticky;
  top:0;
  z-index:20;
  height:58px;
  min-height:58px;
  max-height:58px;
  flex-shrink:0;
  margin-inline:-22px;
  padding:0;
  border-bottom:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1;
  background:var(--bg)
}
.top__inner{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  width:100%;
  max-width:1400px;
  height:58px;
  margin-inline:auto;
  padding:0 60px
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--signal);
  width:max-content
}
.brand img{
  border-radius:50%;
  object-fit:cover
}
.primary-nav{
  display:flex;
  gap:24px
}
.primary-nav a,.theme-toggle{
  color:var(--dim)
}
.primary-nav a[aria-current],.primary-nav a:hover{
  color:var(--text)
}
.theme-toggle{
  justify-self:end;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:44px;
  padding:5px 8px;
  border:0;
  border-radius:4px;
  background:transparent;
  font:inherit;
  cursor:pointer
}
.theme-toggle:hover .theme-toggle__label{
  color:var(--text)
}
.theme-toggle__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  color:var(--amber);
  font-size:16px
}
.theme-toggle__icon::before{
  width:14px;
  height:14px;
  background:currentColor;
  content:"";
  mask:url("/static/core/img/icons/sun.0e059d1277f1.svg") center/contain no-repeat
}
.theme-toggle[aria-pressed=true] .theme-toggle__icon::before{
  mask-image:url("/static/core/img/icons/moon.f011b52b13f9.svg")
}
.theme-toggle__label{
  transition:color .2s
}
.workspace{
  min-width:0;
  border-inline:0
}
.workspace--home{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr)
}
.hero{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding:24px clamp(24px,6vw,90px);
  border-right:1px solid var(--line)
}
.prompt{
  margin-bottom:24px;
  color:var(--dim)
}
.prompt span{
  color:var(--signal)
}
.prompt .prompt__command{
  color:inherit;
  white-space:nowrap
}
h1,h2,h3{
  font-family:Inter,Arial,sans-serif
}
.hero h1{
  max-width:800px;
  margin:0;
  font-size:clamp(42px,7vw,94px);
  font-weight:500;
  line-height:1.02;
  letter-spacing:-.065em
}
.intro{
  max-width:590px;
  margin:14px 0 0;
  color:var(--dim)
}
.featured-project{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(180px,.65fr);
  gap:24px;
  align-items:start;
  margin-top:40px;
  padding-top:24px;
  border-top:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1
}
.section-label{
  grid-column:1/-1;
  margin:0;
  color:var(--dim);
  font:500 11px/1.5 'JetBrains Mono',monospace
}
.featured-project__image{
  display:block;
  width:100%;
  height:auto;
  border-radius:6px
}
.featured-project__media{
  display:block;
  min-width:0
}
.featured-project__body h2{
  margin:0 0 10px;
  font-size:clamp(22px,3vw,34px);
  line-height:1.1;
  letter-spacing:-.04em
}
.featured-project__body p{
  margin:0;
  color:var(--dim)
}
.featured-project__link{
  display:inline-block;
  margin-top:20px;
  color:var(--link);
  font-size:12px
}
.tech-stack{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:12px
}
.tech-stack__item{
  position:relative;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:4px
}
.tech-stack__item img{
  width:18px;
  height:18px
}
.tech-stack__item::after,.footer-icon::after,.project-row__technology::after{
  position:absolute;
  bottom:calc(100% + 7px);
  left:50%;
  z-index:30;
  padding:4px 7px;
  color:var(--text);
  font-size:12px;
  line-height:1;
  white-space:nowrap;
  pointer-events:none;
  content:attr(aria-label);
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:4px;
  opacity:0;
  transform:translate(-50%,3px);
  transition:opacity .14s,transform .14s
}
.tech-stack__item::after{content:attr(data-tooltip)}
.tech-stack__item:hover::after,.tech-stack__item:focus::after,.footer-icon:hover::after,.footer-icon:focus::after,.project-row__technology:hover::after,.project-row__technology:focus::after{
  opacity:1;
  transform:translate(-50%,0)
}
.side{
  display:flex;
  min-width:0;
  flex-direction:column
}
.side-title{
  margin:0;
  padding:18px;
  background:var(--side-header);
  border-bottom:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1;
  color:var(--dim);
  font:500 11px/1.5 'JetBrains Mono',monospace
}
.project-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  padding:25px 20px;
  border-bottom:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1;
  transition:background-color .2s
}
.project-item:hover{
  background:var(--hover)
}
.project-item b{
  font:600 18px Inter,Arial,sans-serif
}
.project-item small{
  grid-column:1;
  color:var(--dim)
}
.project-item>span{
  color:var(--signal)
}
.view-all{
  align-self:flex-start;
  margin:22px 20px;
  padding-top:22px;
  color:var(--link);
  font-size:12px
}
.empty-state{
  margin:0;
  padding:25px 20px;
  color:var(--dim)
}
.status{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:58px;
  padding:12px 38px;
  border-top:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1;
  color:var(--dim)
}
.copyright{
  position:absolute;
  left:50%;
  transform:translateX(-50%)
}
.status-label{
  display:inline-flex;
  align-items:center;
  gap:8px
}
.status-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--dim)
}
.footer-icons{
  display:flex;
  gap:8px
}
.footer-icon{
  position:relative;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:4px;
  background:var(--hover);
  transition:transform .2s
}
.footer-icon:hover{
  transform:translateY(-2px)
}
.footer-icon img{
  width:18px;
  height:18px
}
.footer-icon:first-child img{
  filter:invert(1)
}
html[data-theme=light] .footer-icon:first-child img{
  filter:none
}
.footer-icon--email img{
  display:none
}
.footer-icon--email::before{
  width:18px;
  height:18px;
  background:#dadee9;
  content:"";
  mask:url("/static/core/img/icons/email.466ab5409d3c.svg") center/contain no-repeat
}
html[data-theme=light] .footer-icon--email::before{
  background:#161614
}
.messages{
  padding:8px 18px;
  background:var(--panel)
}
.messages p{
  margin:0
}
.workspace--page{
  display:block
}
.page{
  width:min(760px,calc(100% - 48px));
  min-height:calc(100vh - 180px);
  margin:0 auto;
  padding:24px 0 clamp(48px,8vw,100px)
}
.page h1{
  margin:0 0 16px;
  font-size:clamp(36px,7vw,64px);
  line-height:1.05;
  letter-spacing:-.045em
}
.page h2{
  margin:36px 0 8px;
  font-size:18px
}
.page p,.page li{
  color:var(--dim)
}
.page a:not(.button){
  color:var(--link)
}
.email-link{
  white-space:nowrap
}
.lede{
  font-size:17px;
  line-height:1.65
}
.project-list{
  margin-top:16px;
  border-top:0
}
.project-row{
  display:flex;
  justify-content:space-between;
  gap:24px;
  padding:24px 0;
  border-bottom:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1
}
.project-row:last-child{
  border-bottom:0;
  border-image:none
}
.project-row b,.project-row small{
  display:block
}
.project-row__category{
  display:block;
  margin-bottom:5px;
  color:var(--signal);
  font-size:12px
}
.project-row__technologies{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-inline-start:auto;
  vertical-align:middle;
  color:var(--text);
  flex-shrink:0;
  align-self:flex-end
}
.project-row__technologies img{
  display:block;
  width:16px;
  height:16px;
  object-fit:contain;
  opacity:.7
}
html[data-theme=light] .project-row__technologies img{
  opacity:.8
}
.project-row__technology{
  position:relative;
  display:inline-flex
}
html[data-theme=dark] img[data-technology-key=flask]{
  filter:invert(1)
}
.project-row b{
  display:flex;
  align-items:center;
  gap:0;
  font:600 19px Inter,sans-serif
}
.project-row small{
  margin-top:5px;
  color:var(--dim)
}
.project-row>span:last-child{
  color:var(--signal)
}
@media(max-width:720px){
  .project-row{
    flex-wrap:wrap;
    column-gap:12px;
    row-gap:8px
  }
  .project-row>span:first-child{
    min-width:0;
    flex:1 1 0
  }
  .project-row__technologies{
    order:3;
    width:100%;
    margin-inline-start:0;
    flex:0 0 100%;
    align-self:auto
  }
  .project-row>span:last-child{
    order:2;
    align-self:flex-start
  }
}
.project-cover{
  display:block;
  width:100%;
  height:auto;
  margin:32px 0;
  object-fit:contain;
  border-radius:6px
}
.prose{
  margin-top:32px
}
.prose h1,.prose h2,.prose h3,.prose h4,.prose h5,.prose h6{
  margin:28px 0 8px;
  color:var(--text)
}
.prose p,.prose ul,.prose ol,.prose blockquote,.prose pre{
  margin:12px 0
}
.prose ul,.prose ol{
  padding-left:24px
}
.prose blockquote{
  padding-left:16px;
  border-left:2px solid var(--line)
}
.prose code,.prose pre{
  background:var(--panel);
  color:var(--text)
}
.prose code{
  padding:2px 4px
}
.prose pre{
  max-width:100%;
  padding:12px;
  overflow:auto
}
.prose pre code{
  padding:0
}
.prose a{
  display:inline-block;
  color:var(--link);
  font-weight:500;
  transition:color .2s,transform .2s
}
.prose a:hover{
  color:var(--text);
  transform:translateY(-2px)
}
.project-media-unavailable{
  margin:32px 0;
  color:var(--dim)!important;
  font-size:12px
}
.project-gallery,.project-information,.project-features{
  margin-top:40px;
  padding-top:24px;
  border-top:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1
}
.project-gallery__heading,.project-dialog__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px
}
.project-gallery h2,.project-information h2,.project-features h2{
  margin:0;
  color:var(--text);
  font-size:18px
}
.project-gallery__count,.project-gallery-dialog__status{
  color:var(--dim);
  font-size:12px
}
.project-gallery__fallback .project-gallery__count{
  margin-left:4px
}
.project-gallery__teaser{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:16px
}
.project-gallery__teaser--1{
  grid-template-columns:minmax(0,1fr)
}
.project-gallery__teaser--2{
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.project-gallery__figure{
  min-width:0;
  margin:0
}
.project-gallery__link{
  display:block;
  min-width:0
}
.project-gallery__link:hover,.project-gallery__link:focus-visible{
  transform:none!important
}
.project-gallery__link img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:contain;
  border-radius:6px
}
.project-gallery__caption{
  margin:12px 0 0;
  color:var(--dim);
  font-size:12px
}
.project-gallery__fallback{
  margin-top:12px
}
.project-gallery__fallback>summary{
  min-height:44px;
  padding:10px 0;
  color:var(--link);
  font-weight:500;
  transition:color .2s,transform .2s;
  cursor:pointer
}
.project-gallery__fallback>summary:hover,.project-gallery__fallback>summary:focus-visible{
  color:var(--text);
  transform:translateY(-2px)
}
.project-gallery__fallback>summary:focus-visible{
  outline:2px solid var(--amber);
  outline-offset:3px
}
.project-gallery__fallback ul{
  margin:8px 0 0;
  padding-left:24px
}
.project-gallery[data-gallery-enhanced=true] .project-gallery__fallback>summary{
  display:inline-flex;
  align-items:center;
  list-style:none
}
.project-gallery[data-gallery-enhanced=true] .project-gallery__fallback>summary::-webkit-details-marker{
  display:none
}
.project-gallery[data-gallery-enhanced=true] .project-gallery__fallback ul{
  display:none
}
.project-information__list{
  margin:16px 0 0
}
.project-information__list div{
  display:grid;
  grid-template-columns:minmax(90px,auto) 1fr;
  gap:16px
}
.project-information__list dt{
  color:var(--dim)
}
.project-information__list dd{
  margin:0
}
.project-information h3{
  margin:20px 0 0;
  color:var(--text);
  font-size:14px
}
.project-technologies__list{
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  margin:16px 0 0;
  padding:0;
  list-style:none
}
.project-technologies__list li{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  color:var(--text)
}
.project-technologies__list img{
  flex:0 0 24px
}
.project-features details{
  margin-top:16px
}
.project-features summary{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--link);
  font-weight:500;
  transition:color .2s,transform .2s;
  cursor:pointer
}
.project-features summary:hover,.project-features summary:focus-visible{
  color:var(--text);
  transform:translateY(-2px)
}
.project-features details .prose{
  margin-top:16px
}
.project-gallery-dialog,.project-feature-dialog{
  width:min(1100px,calc(100% - 24px));
  max-width:calc(100% - 24px);
  max-height:calc(100% - 24px);
  margin:auto;
  padding:0;
  border:0;
  border-radius:6px;
  background:var(--panel);
  color:var(--text)
}
.project-gallery-dialog::backdrop,.project-feature-dialog::backdrop{
  background:rgba(2,4,6,.88)
}
.project-dialog__panel{
  display:flex;
  max-height:calc(100vh - 24px);
  flex-direction:column;
  gap:16px;
  padding:18px
}
.project-dialog__header h2{
  margin:0;
  color:var(--text);
  font-size:18px
}
.project-dialog__header>div:first-child{
  min-width:0
}
.project-dialog__close,.project-gallery-dialog__controls button{
  min-height:44px;
  padding:10px 16px;
  border:0;
  border-radius:4px;
  background:var(--signal);
  color:var(--bg);
  font:inherit;
  cursor:pointer;
  transition:background-color .2s,color .2s,transform .2s
}
.project-dialog__close:hover,.project-gallery-dialog__controls button:hover{
  background:var(--hover);
  color:var(--link);
  transform:translateY(-2px)
}
html[data-theme=light] .project-dialog__close:hover,html[data-theme=light] .project-gallery-dialog__controls button:hover{
  background:var(--line)
}
.project-dialog__close:focus-visible,.project-gallery-dialog__controls button:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 1px var(--dim)
}
.project-gallery-dialog__slides{
  position:relative;
  display:grid;
  height:min(62vh,675px);
  min-height:0;
  padding:36px 60px 0;
  box-sizing:border-box;
  place-items:center
}
.project-gallery-dialog__slides figure{
  display:flex;
  width:100%;
  height:100%;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin:0;
  text-align:center
}
.project-gallery-dialog__slides figure[hidden]{
  display:none
}
.project-gallery-dialog__slides img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:calc(100% - 32px);
  height:auto;
  margin-inline:auto;
  object-fit:contain;
  border-radius:6px
}
.project-gallery-dialog__alt-text{
  margin:12px 0 0;
  color:var(--dim);
  font-size:12px;
  text-align:center
}
.project-gallery-dialog__caption:empty{
  display:none
}
.project-gallery-dialog__caption .project-gallery__caption{
  margin:0;
  color:var(--dim)
}
.project-gallery-dialog__controls{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  pointer-events:none
}
.project-gallery-dialog__controls .project-gallery-dialog__status{
  position:absolute;
  top:12px;
  left:50%;
  margin:0;
  text-align:center;
  transform:translateX(-50%)
}
.project-gallery-dialog__controls button{
  min-width:44px;
  padding:4px 12px;
  font-size:28px;
  font-weight:800;
  line-height:1;
  pointer-events:auto
}
@media(max-width:600px){
  .project-gallery-dialog__slides{
    padding-inline:52px
  }
}
.project-feature-dialog .prose{
  max-height:calc(100vh - 150px);
  margin:0;
  overflow:auto
}
.project-feature-dialog .prose h1:first-child,.project-feature-dialog .prose h2:first-child,.project-feature-dialog .prose h3:first-child{
  margin-top:0
}
.actions{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  margin-top:32px
}
.project-detail__back{
  display:inline-flex;
  width:fit-content;
  max-width:100%;
  flex-direction:column;
  gap:10px;
  align-items:stretch
}
.project-detail__back::before{
  content:"";
  width:100%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--line) 20%,var(--line) 80%,transparent)
}
.page .project-detail__back a{
  color:var(--dim)
}
.page .project-detail__back a:hover{
  color:var(--text)
}
.page a.about-work-link{
  color:var(--link)
}
.page a.about-work-link:hover{
  color:var(--text)
}
.workspace a:not(.button){
  font-weight:500;
  transition:color .2s,transform .2s
}
.workspace a:not(.button):hover{
  color:var(--text);
  transform:translateY(-2px)
}
.form{
  display:grid;
  gap:20px;
  margin-top:36px
}
.form-row{
  display:grid;
  gap:7px
}
.form input,.form textarea{
  appearance:none;
  width:100%;
  min-height:44px;
  padding:12px;
  border:0;
  box-sizing:border-box;
  border-radius:4px;
  background:var(--panel);
  color:var(--text);
  font:inherit;
  transition:background-color .2s
}
.form-row:focus-within label{
  color:var(--signal)
}
.form textarea{
  min-height:150px;
  resize:vertical
}
.button{
  justify-self:start;
  min-height:44px;
  padding:10px 16px;
  border:1px solid var(--line);
  border-radius:4px;
  background:var(--signal);
  color:var(--bg);
  font:inherit;
  cursor:pointer;
  transition:background-color .2s,color .2s,transform .2s
}
.contact-page .button{
  border:0
}
.contact-page .button:hover:not(:disabled){
  background:var(--hover);
  color:var(--link);
  transform:translateY(-2px)
}
html[data-theme=light] .contact-page .button:hover:not(:disabled){
  background:var(--line)
}
.form-error{
  margin:0;
  color:var(--error)!important
}
.contact-page>.form-status{
  min-height:0;
  margin-top:20px;
  padding:12px 16px;
  box-sizing:border-box;
  border-radius:4px;
  background:color-mix(in srgb,var(--signal) 14%,var(--bg));
  color:var(--text)
}
.contact-page>.form-status+.form{
  margin-top:20px
}
.contact-verification{
  margin:0;
  padding:16px 0;
  border:0;
  border-block:1px solid var(--line)
}
.contact-verification legend{
  padding:0;
  color:var(--text);
  font-weight:600
}
.contact-verification .form-note{
  margin:4px 0 12px
}
.button:disabled{
  cursor:wait;
  opacity:.7
}
.form-note{
  font-size:12px
}
.honeypot{
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important
}
.privacy-page h2,.security-page h2{
  margin:18px 0 4px
}
.privacy-page p,.security-page p,.security-page ul{
  margin-top:4px;
  margin-bottom:8px
}
.security-page ul{
  padding-left:20px
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--amber);
  outline-offset:3px
}
.form input:focus-visible,.form textarea:focus-visible{
  background:var(--hover);
  outline:none
}
.contact-page .button:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 1px var(--dim)
}

.status-links{
  display:flex;
  align-items:center;
  gap:8px
}

@media(max-width:760px){
  .shell{
    padding:0 10px 10px
  }
  .top{
    height:58px;
    min-height:58px;
    max-height:58px;
    margin-inline:-10px;
  }
  .top__inner{
    grid-template-columns:auto 1fr auto;
    gap:12px;
    height:58px;
    padding:0 24px
  }
  .primary-nav{
    justify-content:center;
    gap:12px;
    min-width:0;
    align-items:center;
    overflow:hidden
  }
  .primary-nav::-webkit-scrollbar{
    display:none
  }
  .primary-nav a{
    flex:0 0 auto;
    padding:8px 0
  }
  .workspace--home{
    grid-template-columns:1fr
  }
  .hero{
    padding:24px;
    border-right:0;
    border-bottom:1px solid transparent;
    border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1
  }
  .featured-project{
    grid-template-columns:1fr;
    gap:18px;
  }
  .section-label{
    grid-column:auto;
  }
  .copyright{
    position:static;
    transform:none
  }
  .status{
    gap:12px 18px;
    padding-inline:18px
  }
  .page{
    width:min(100% - 32px,760px)
  }
}

@media(max-width:600px){
  .status{
    flex-direction:column;
    justify-content:center;
    padding-block:18px;
    text-align:center
  }
  .status-links{
    justify-content:center;
    flex-wrap:wrap
  }
  .copyright{
    position:static;
    order:2;
    transform:none
  }
  .footer-icons{
    order:3
  }
}

@media(max-width:490px){
  .brand span{
    display:none
  }
  .primary-nav{
    gap:15px
  }
  .brand__context{
    display:none
  }
  .hero h1{
    font-size:clamp(36px,12vw,42px)
  }
  .hero{
    padding:24px 18px
  }
  .page{
    width:calc(100% - 24px)
  }
  .prompt{
    overflow-wrap:anywhere
  }
}

@media(max-width:400px){
  .top__inner{
    padding-inline:10px
  }
  .brand{
    gap:6px;
    font-size:12px
  }
  .theme-toggle__label{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap
  }
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    transition:none!important
  }
}

.visually-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
  border:0!important
}
.project-filters{
  margin-top:40px;
  color:var(--text)
}
.project-filters__toolbar{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px
}
.project-filters__toggle{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  min-height:44px;
  padding:0;
  color:var(--text);
  background:transparent;
  border:0;
  font:inherit;
  font-weight:700;
  cursor:pointer
}
.project-filters__toggle:hover{
  color:var(--link);
  transform:translateY(-2px)
}
.project-filters__toggle:focus-visible,
.project-filters__dropdown-toggle:focus-visible,
.project-filters__options input:focus-visible + span,
.project-filters__search-submit:focus-visible,
.project-filters__search-clear:focus-visible,
.project-filters__clear:focus-visible,
.project-filters__active a:focus-visible{
  outline:2px solid var(--amber);
  outline-offset:3px
}
.project-filters__icon-wrap{
  position:relative;
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  width:22px;
  height:24px
}
.project-filters__icon,
.project-filters__control-icon,
.project-filters__dropdown-chevron,
.project-filters__chevron{
  fill:none;
  stroke:currentColor;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:1.8
}
.project-filters__icon{
  width:18px;
  height:18px
}
.project-filters__active-dot{
  position:absolute;
  top:0;
  right:0;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--signal)
}
.project-filters__active-count{
  position:absolute;
  right:-2px;
  bottom:-2px;
  color:var(--signal);
  font-size:9px;
  font-weight:800;
  line-height:1
}
.project-filters__chevron{
  width:16px;
  height:16px;
  transition:transform .2s
}
.project-filters__toggle[aria-expanded=true] .project-filters__chevron{
  transform:rotate(180deg)
}
.project-filters__search-form{
  flex:0 0 auto;
  width:min(100%,360px);
  min-width:0
}
.project-filters__search-control{
  display:flex;
  align-items:center;
  min-height:36px;
  background:var(--filter-surface);
  border:0;
  border-radius:4px;
  transition:background-color .2s
}
.project-filters__search-control:focus-within{
  background:var(--filter-focus)
}
.project-filters__search-submit,
.project-filters__search-clear{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:36px;
  min-height:36px;
  padding-inline:8px;
  color:var(--dim);
  background:transparent;
  border:0;
  font:inherit;
  cursor:pointer
}
.project-filters__search-submit svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:1.8
}
.project-filters__search-submit:hover,
.project-filters__search-clear:hover{
  color:var(--link)
}
.project-filters__search-control input[type=search]{
  min-width:0;
  width:100%;
  min-height:34px;
  padding:0 4px;
  color:var(--text);
  background:transparent;
  border:0;
  font:inherit
}
.project-filters__search-control input[type=search]:focus,
.project-filters__search-control input[type=search]:focus-visible{
  outline:0;
  box-shadow:none
}
.project-filters__search-control input[type=search]::placeholder{
  color:var(--dim);
  opacity:1
}
.project-filters__search-control input[type=search]::-webkit-search-cancel-button{
  appearance:none
}
.project-filters__panel{
  margin-top:12px;
  padding:0;
  overflow:visible
}
.project-filters--enhanced .project-filters__panel[hidden]{
  display:none
}
.project-filters__form{
  min-width:0
}
.project-filters__controls{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
  gap:10px
}
.project-filters__dropdown{
  position:relative;
  min-width:0;
  margin:0;
  padding:0;
  border:0
}
.project-filters__dropdown-toggle{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:36px;
  padding:0 10px;
  color:var(--text);
  text-align:left;
  background:var(--filter-surface);
  border:0;
  border-radius:4px;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer
}
.project-filters__dropdown-toggle:hover{
  color:var(--link);
  transform:translateY(-2px)
}
.project-filters__control-icon{
  width:18px;
  height:18px;
  flex:0 0 auto
}
.project-filters__dropdown-toggle>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.project-filters__dropdown-chevron{
  width:16px;
  height:16px;
  flex:0 0 auto;
  margin-left:auto;
  transition:transform .2s
}
.project-filters__dropdown-toggle[aria-expanded=true] .project-filters__dropdown-chevron{
  transform:rotate(180deg)
}
.project-filters__dropdown-panel{
  margin-top:8px;
  padding:10px 12px;
  color:var(--text);
  background:var(--filter-surface);
  border:0;
  border-radius:4px
}
.project-filters--enhanced .project-filters__dropdown-panel{
  position:absolute;
  z-index:10;
  top:100%;
  right:0;
  left:0;
  min-width:100%;
  max-width:min(24rem,calc(100vw - 24px));
  margin-top:8px
}
.project-filters__options{
  display:grid;
  gap:2px
}
.project-filters__options--scroll{
  max-height:15rem;
  overflow-y:auto
}
.project-filters__options label{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
  min-height:44px;
  color:var(--dim);
  cursor:pointer;
  font-size:13px
}
.project-filters__options label:hover,
.project-filters__options label:focus-within{
  color:var(--text)
}
.project-filters__options input{
  flex:0 0 auto;
  width:17px;
  height:17px;
  accent-color:var(--signal)
}
.project-filters--enhanced .project-filters__dropdown--single .project-filters__options input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0
}
.project-filters__dropdown--single .project-filters__options label>span{
  position:relative;
  padding-inline-start:18px
}
.project-filters__dropdown--single .project-filters__options label>span::before{
  position:absolute;
  top:50%;
  left:0;
  color:var(--signal);
  content:"→";
  opacity:0;
  transform:translateY(-50%)
}
.project-filters--enhanced .project-filters__dropdown--single .project-filters__options input:checked+span{
  color:var(--text)
}
.project-filters--enhanced .project-filters__dropdown--single .project-filters__options input:checked+span::before{
  opacity:1
}
.project-filters__helper-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin-bottom:4px;
  color:var(--dim);
  font-size:11px;
  line-height:1.4
}
.project-filters__helper-row p{
  margin:0
}
.project-filters__dropdown-clear{
  flex:0 0 auto;
  min-height:44px;
  padding-top:12px;
  color:var(--text)!important;
  font-size:12px;
  font-weight:600
}
.project-filters__dropdown-clear:hover{
  color:var(--link)!important
}
.project-filters__empty-option{
  min-height:44px;
  padding-block:10px;
  color:var(--dim);
  font-size:12px
}
.project-filters__active{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 16px;
  margin-top:16px
}
.project-filters__active h2{
  flex:0 0 auto;
  margin:0;
  color:var(--dim);
  font:500 11px/1.5 'JetBrains Mono',monospace
}
.project-filters__active ul{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none
}
.project-filters__active li{
  display:inline-flex;
  align-items:center;
  gap:5px;
  max-width:100%;
  min-height:36px;
  padding:3px 4px 3px 9px;
  color:var(--dim);
  background:var(--filter-surface);
  border:0;
  border-radius:4px;
  font-size:11px;
  overflow-wrap:anywhere
}
.project-filters__active li>span{
  overflow-wrap:anywhere
}
.project-filters__active li a{
  display:inline-grid;
  place-items:center;
  width:28px;
  min-height:28px;
  color:var(--signal)!important;
  font-size:18px;
  line-height:1
}
.project-filters__active li a:hover{
  color:var(--link)!important
}
.project-filters__clear{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  color:var(--text)!important;
  font-size:11px;
  font-weight:700
}
.project-filters__clear:hover{
  color:var(--link)!important
}
.project-filter-results{
  min-width:0
}
.project-list__empty{
  margin-top:40px;
  padding:20px 0;
  border-top:1px solid transparent;
  border-image:linear-gradient(to right,transparent,var(--line) 20%,var(--line) 80%,transparent) 1
}
.project-list__empty h2{
  margin:0 0 8px;
  color:var(--text);
  font-size:20px
}
.project-list__empty p{
  margin:0 0 16px;
  color:var(--dim)
}
.project-list__empty a{
  color:var(--link)!important;
  font-weight:600
}
@media(max-width:39.999rem){
  .project-filters__toolbar{
    gap:8px
  }
  .project-filters__search-form{
    width:min(100%,360px)
  }
  .project-filters__controls{
    grid-template-columns:minmax(0,1fr)
  }
  .project-filters--enhanced .project-filters__dropdown-panel{
    position:static;
    max-width:none
  }
  .project-filters__active{
    align-items:flex-start;
    flex-direction:column
  }
  .project-filters__active h2{
    width:100%
  }
  .project-filters__active li a{
    width:44px;
    min-height:44px
  }
  .project-filters__clear{
    min-height:44px
  }
}
@media(prefers-reduced-motion:reduce){
  .project-filters__toggle,
  .project-filters__dropdown-toggle,
  .project-filters__chevron,
  .project-filters__dropdown-chevron,
  .project-filters__active li a{
    transition:none
  }
}