/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-italic-cyrillic-ext.woff") format('woff');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-italic-cyrillic.woff") format('woff');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-italic-greek.woff") format('woff');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-italic-vietnamese.woff") format('woff');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-italic-latin-ext.woff") format('woff');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-italic-latin.woff") format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/jetbrains-mono-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/jetbrains-mono-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/jetbrains-mono-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/jetbrains-mono-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/jetbrains-mono-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/jetbrains-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/jetbrains-mono-cyrillic-ext.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/jetbrains-mono-cyrillic.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/jetbrains-mono-greek.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/jetbrains-mono-vietnamese.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/jetbrains-mono-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/jetbrains-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
/* base ramp — near-black with a green cast */
--bg-0:#0A0D0B; --bg-1:#0F1310; --bg-2:#141A16; --bg-3:#1A211C;
--fg-1:#E6EDE8; --fg-2:#98A69D; --fg-3:#5C6961;
--line-1:rgba(230,237,232,.09); --line-2:rgba(230,237,232,.18);
/* accent — terminal green */
--green-300:#8FF5BC; --green-400:#46E58E; --green-500:#2ECC77; --green-600:#1E9C58;
--green-tint:rgba(70,229,142,.08); --green-line:rgba(70,229,142,.38);
/* semantic */
--amber:#E3C567; --red:#F07A7A; --blue:#7AB8F0;
/* aliases */
--surface-page:var(--bg-0); --surface-card:var(--bg-1); --surface-raised:var(--bg-2); --surface-hover:var(--bg-3);
--text-color:var(--fg-1); --text-muted:var(--fg-2); --text-faint:var(--fg-3); --text-accent:var(--green-400);
--border-hairline:1px solid var(--line-1); --border-strong:1px solid var(--line-2); --border-accent:1px solid var(--green-line);
--font-mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;
--font-sans:'IBM Plex Sans',system-ui,sans-serif;
--text-display:40px; --lh-display:1.15;
--text-h2:24px; --text-h3:17px;
--text-body:15px; --lh-body:1.65;
--text-small:13px; --text-label:11px; --tracking-label:.09em;
--space-5:24px; --space-6:32px;
--container:1080px;
}
body{background:var(--surface-page);color:var(--text-color);font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--lh-body);margin:0;-webkit-font-smoothing:antialiased}
::selection{background:var(--green-400);color:var(--bg-0)}
a{color:var(--text-accent);text-decoration:none;border-bottom:1px solid var(--green-line)}
a:hover{color:var(--green-300);border-bottom-color:var(--green-300)}
code,pre,kbd{font-family:var(--font-mono)}
h1,h2,h3,h4{font-family:var(--font-mono);font-weight:500;margin:0}

.wrap{max-width:var(--container);margin:0 auto;padding-left:32px;padding-right:32px}
.micro{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-faint)}
.dot-main{color:var(--green-400)}
.dot-oss{color:var(--amber)}

/* nav */
nav{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:var(--border-hairline)}
.nav-name{font-family:var(--font-mono);font-size:14px;font-weight:500;color:var(--text-color)}
.nav-name span{color:var(--green-400)}
.nav-links{display:flex;gap:24px}
.nav-links a{font-family:var(--font-mono);font-size:13px;color:var(--text-muted);border:none;transition:color .14s ease-out}
.nav-links a:hover{color:var(--text-color)}

/* hero */
header.hero{padding-top:96px;padding-bottom:96px}
.hero-prompt{font-family:var(--font-mono);font-size:14px;color:var(--text-muted);margin-bottom:20px}
.hero-prompt span{color:var(--green-400)}
h1{font-size:var(--text-display);line-height:var(--lh-display)}
.cursor{color:var(--green-400);animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero-lede{color:var(--text-muted);max-width:520px;margin:24px 0 32px}
.hero-actions{display:flex;gap:12px;align-items:center}

/* buttons */
.btn{font-family:var(--font-mono);font-size:13px;font-weight:500;letter-spacing:.02em;padding:9px 18px;border-radius:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .14s ease-out,color .14s ease-out,border-color .14s ease-out;text-decoration:none;line-height:1.4}
.btn-primary{background:var(--green-400);color:var(--bg-0);border:1px solid var(--green-400)}
.btn-primary:hover{background:var(--green-300);border-color:var(--green-300);color:var(--bg-0)}
.btn-secondary{background:transparent;color:var(--text-color);border:var(--border-strong)}
.btn-secondary:hover{background:var(--surface-hover);color:var(--text-color)}

/* sections */
section{padding-bottom:96px}
.section-header{display:flex;align-items:baseline;gap:16px;border-bottom:var(--border-hairline);padding-bottom:14px;margin-bottom:var(--space-6)}
.section-index{font-family:var(--font-mono);font-size:13px;color:var(--green-400)}
.section-header h2{font-size:var(--text-h2);color:var(--text-color)}
.section-note{margin-left:auto}

/* work graph */
.wg-scroll{overflow-x:auto}
.wg{display:grid;grid-template-columns:134px 1fr;gap:var(--space-6);align-items:start}
.wg-svg{display:block}
.wg-year{font-family:var(--font-mono);font-size:9px}
.wg-node{cursor:pointer}
.wg-ring{opacity:0}
.wg-node:hover .wg-ring{opacity:.45}
/* stretch the list to the svg's height so .wg-rows keeps a stable bottom edge:
   the reset-to-first on mouseleave must not move that boundary, or leaving
   through the bottom would shift rows back under the cursor and oscillate */
.wg-list{display:flex;flex-direction:column;align-self:stretch}
.wg-rows{flex:1}
.wg-legend{display:flex;gap:20px;padding-bottom:12px}
.wg-row{border-bottom:var(--border-hairline);border-left:1px solid transparent;padding:14px 16px;background:transparent;transition:background .14s ease-out}
.wg-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.wg-hash{font-family:var(--font-mono);font-size:12px}
.lane-main .wg-hash{color:var(--green-400)}
.lane-oss .wg-hash{color:var(--amber)}
.wg-role{font-family:var(--font-mono);font-size:15px;font-weight:500;color:var(--text-muted)}
.wg-org{color:var(--text-muted);font-weight:400}
.wg-org a{color:inherit;border:none;text-decoration:underline;text-underline-offset:3px}
.lane-main .wg-org a{text-decoration-color:var(--green-400)}
.lane-oss .wg-org a{text-decoration-color:var(--amber)}
.wg-place{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:var(--tracking-label)}
.wg-dates{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--text-faint);white-space:nowrap}
.wg-detail{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s ease-out}
.wg-detail-inner{overflow:hidden;display:flex;flex-direction:column;gap:6px;padding-top:0;transition:padding-top .22s ease-out}
.wg-summary{margin:0;color:var(--text-muted);font-size:14px;line-height:1.55;max-width:560px}
.wg-bullets{display:flex;flex-direction:column;gap:6px;max-width:560px}
.wg-bullet{display:flex;gap:10px}
.wg-bullet span:last-child{color:var(--text-muted);font-size:14px;line-height:1.55}
.wg-dash{font-family:var(--font-mono);font-size:13px;line-height:1.55;flex-shrink:0}
.lane-main .wg-dash{color:var(--green-400)}
.lane-oss .wg-dash{color:var(--amber)}

/* expanded row state: .wg-active, set by script on hover; first row at rest */
.wg-row.wg-active{background:var(--surface-card)}
.lane-main.wg-row.wg-active{border-left:1px solid var(--green-400)}
.lane-oss.wg-row.wg-active{border-left:1px solid var(--amber)}
.wg-row.wg-active .wg-role{color:var(--text-color)}
.wg-row.wg-active .wg-detail{grid-template-rows:1fr}
.wg-row.wg-active .wg-detail-inner{padding-top:8px}
/* keep the role muted color override for org part */
.wg-row.wg-active .wg-org{color:var(--text-muted)}

/* svg node highlight follows the active row */
.wg:has(.row-stainless.wg-active) .node-stainless .wg-ring{opacity:.45}
.wg:has(.row-stainless.wg-active) .node-stainless .wg-dot{fill:var(--green-400)}
.wg:has(.row-capo.wg-active) .node-capo .wg-ring{opacity:.45}
.wg:has(.row-capo.wg-active) .node-capo .wg-dot{fill:var(--amber)}
.wg:has(.row-zapros.wg-active) .node-zapros .wg-ring{opacity:.45}
.wg:has(.row-zapros.wg-active) .node-zapros .wg-dot{fill:var(--amber)}
.wg:has(.row-actum.wg-active) .node-actum .wg-ring{opacity:.45}
.wg:has(.row-actum.wg-active) .node-actum .wg-dot{fill:var(--green-400)}
.wg:has(.row-fabrique.wg-active) .node-fabrique .wg-ring{opacity:.45}
.wg:has(.row-fabrique.wg-active) .node-fabrique .wg-dot{fill:var(--green-400)}
.wg:has(.row-httpx.wg-active) .node-httpx .wg-ring{opacity:.45}
.wg:has(.row-httpx.wg-active) .node-httpx .wg-dot{fill:var(--amber)}
.wg:has(.row-hishel.wg-active) .node-hishel .wg-ring{opacity:.45}
.wg:has(.row-hishel.wg-active) .node-hishel .wg-dot{fill:var(--amber)}
.wg:has(.row-mod.wg-active) .node-mod .wg-ring{opacity:.45}
.wg:has(.row-mod.wg-active) .node-mod .wg-dot{fill:var(--green-400)}
.wg:has(.row-nda.wg-active) .node-nda .wg-ring{opacity:.45}
.wg:has(.row-nda.wg-active) .node-nda .wg-dot{fill:var(--green-400)}

/* projects */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.card{display:flex;flex-direction:column;gap:14px;background:var(--surface-card);border:var(--border-hairline);padding:var(--space-5);text-decoration:none;transition:background .14s ease-out,border-color .14s ease-out;min-height:200px}
.card:hover{background:var(--surface-raised);border:var(--border-accent)}
.card-head{display:flex;align-items:center;gap:14px}
.card-logo{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--bg-0);border:var(--border-hairline);flex-shrink:0}
.card-logo img{width:30px;height:30px;object-fit:contain}
.card-letter{font-family:var(--font-mono);font-size:20px;font-weight:500;color:var(--green-400)}
.card-title{display:flex;flex-direction:column;gap:3px}
.card-name{font-family:var(--font-mono);font-size:20px;font-weight:500;color:var(--text-color);transition:color .14s ease-out}
.card:hover .card-name{color:var(--text-accent)}
.card-ext{color:var(--text-faint);font-size:14px}
.card-stars{margin-left:auto;font-family:var(--font-mono);font-size:12px;color:var(--text-faint);white-space:nowrap}
.card-desc{margin:0;color:var(--text-muted);font-size:14px;line-height:1.55;flex:1}
.card-foot{display:flex;gap:12px;align-items:center;border-top:var(--border-hairline);padding-top:12px}
.card-arrow{margin-left:auto;color:var(--text-faint);transition:color .14s ease-out}
.card:hover .card-arrow{color:var(--green-400)}

/* footer */
footer{border-top:var(--border-hairline)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;padding-top:28px;padding-bottom:28px;flex-wrap:wrap;gap:12px}
.footer-copy{font-family:var(--font-mono);font-size:12px;color:var(--text-faint)}
.footer-links{display:flex;gap:20px;font-family:var(--font-mono);font-size:12px}
.footer-links a{border:none}

/* responsive */
@media(max-width:640px){
  .wrap{padding-left:20px;padding-right:20px}
  header.hero{padding-top:56px;padding-bottom:56px}
  h1{font-size:clamp(28px,9vw,44px)}
}
@media(max-width:560px){
  .wg{grid-template-columns:1fr}
  .wg-svg{display:none}
}