@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/dcf9aa0f-410e-4b33-84b6-e0acca00d0e2.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/20f90d68-2710-4b75-9dc9-090c5a6fa181.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/e762d99c-7e60-4c09-a1f1-31bc73bfe34d.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;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/dcf9aa0f-410e-4b33-84b6-e0acca00d0e2.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/20f90d68-2710-4b75-9dc9-090c5a6fa181.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/e762d99c-7e60-4c09-a1f1-31bc73bfe34d.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;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/dcf9aa0f-410e-4b33-84b6-e0acca00d0e2.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/20f90d68-2710-4b75-9dc9-090c5a6fa181.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/e762d99c-7e60-4c09-a1f1-31bc73bfe34d.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;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/dcf9aa0f-410e-4b33-84b6-e0acca00d0e2.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/20f90d68-2710-4b75-9dc9-090c5a6fa181.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: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/e762d99c-7e60-4c09-a1f1-31bc73bfe34d.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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: italic;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/23f5775d-54a4-4e06-a3e5-13a9a2b64b28.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: 'Instrument Sans';
  font-style: italic;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/50275883-7e94-4b4e-b9a4-a21fbe96d6ce.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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/49b86f24-b6f0-462e-b1de-96b64ab4d23d.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: 'Instrument Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/0548e314-051e-4f91-9ab2-344e258fbdcd.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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/49b86f24-b6f0-462e-b1de-96b64ab4d23d.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: 'Instrument Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/0548e314-051e-4f91-9ab2-344e258fbdcd.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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/49b86f24-b6f0-462e-b1de-96b64ab4d23d.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: 'Instrument Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url("/fonts/0548e314-051e-4f91-9ab2-344e258fbdcd.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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/6a583344-46a5-497c-b613-7c18ffbf813d.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: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/7746885e-e575-4480-9b2e-0a9988334c88.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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/c37a37fc-2500-406e-ae0e-b0fd8353b182.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: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/0cd20952-413d-4fd9-b23f-6361f8a4bf90.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: 400;
  font-display: swap;
  src: url("/fonts/0393ccdd-29ee-455d-8c5d-cd35c95ea9ab.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/73ea70f4-3634-4153-aa64-57c8d79a3bd3.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/fcd34b47-d124-4f89-9793-51e81cb92d58.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/e3d9665d-db1e-4a38-aa88-de9c57c87f1c.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/5af5abab-dec3-445f-844c-13bf85948418.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/f22aaa4f-7c8c-4f99-b68b-6c706c8c892f.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/0393ccdd-29ee-455d-8c5d-cd35c95ea9ab.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/73ea70f4-3634-4153-aa64-57c8d79a3bd3.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/fcd34b47-d124-4f89-9793-51e81cb92d58.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/e3d9665d-db1e-4a38-aa88-de9c57c87f1c.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/5af5abab-dec3-445f-844c-13bf85948418.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/f22aaa4f-7c8c-4f99-b68b-6c706c8c892f.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{--nb-bg:#06080B;--nb-bg0:rgba(6,8,11,0);--nb-card:#0B0F15;--nb-card2:#080A0E;--nb-header:rgba(6,8,11,0.72);--nb-footer:rgba(4,6,9,0.6);--nb-inset:rgba(4,6,10,0.6);--nb-inset2:rgba(6,8,11,0.6);--nb-ink:#E8EDF5;--nb-ink2:#DCE4EF;--nb-ink3:#C3CDDA;--nb-mute:#9BA7B8;--nb-mute2:#9AA6B6;--nb-mute3:#75808F;--nb-micro:#8895A6;--nb-strike:#7A8798;--nb-s1:rgba(255,255,255,0.026);--nb-s2:rgba(255,255,255,0.04);--nb-s3:rgba(255,255,255,0.07);--nb-l1:rgba(255,255,255,0.09);--nb-l2:rgba(255,255,255,0.14);--nb-l3:rgba(255,255,255,0.3);--nb-sh:rgba(0,0,0,0.6);--nb-scroll:#1E2632;--nb-link:#7FE0BE;--nb-acc-tx:#6FE0A6;--nb-lil-tx:#B49BE6;--nb-blu-tx:#7FB4F2;--nb-wrn-tx:#F0968A;--nb-selfg:#06080B;--nb-aura:1;--nb-noise:0.05;--nb-bar-done:linear-gradient(90deg,#35C2B0,#6FE0A6);--nb-bar-wip:linear-gradient(90deg,#6FE0A6,#B49BE6);--nb-lil-f:rgba(180,155,230,0.12);--nb-lil-b:rgba(180,155,230,0.32);--nb-ghost:rgba(255,255,255,0.36);--nb-onlive:rgba(255,255,255,0.72);--nb-glow:rgba(111,224,166,0.35);--nb-glow2:rgba(111,224,166,0.4);--nb-grad-t:linear-gradient(100deg,#1878D8,#78C0C0 32%,#90D8C0 60%,#C0A8D8);--acc:#6FE0A6;--acc-b:rgba(111,224,166,0.3);--acc-f:rgba(111,224,166,0.07)}
html[data-theme="light"]{--nb-bg:#F4F6FA;--nb-bg0:rgba(244,246,250,0);--nb-card:#FFFFFF;--nb-card2:#F8FAFC;--nb-header:rgba(244,246,250,0.82);--nb-footer:rgba(255,255,255,0.7);--nb-inset:rgba(255,255,255,0.85);--nb-inset2:rgba(255,255,255,0.78);--nb-ink:#0B1219;--nb-ink2:#1C2733;--nb-ink3:#33404E;--nb-mute:#56626F;--nb-mute2:#5D6875;--nb-mute3:#616B78;--nb-micro:#5E6875;--nb-strike:#79838F;--nb-s1:rgba(11,18,25,0.032);--nb-s2:rgba(11,18,25,0.05);--nb-s3:rgba(11,18,25,0.07);--nb-l1:rgba(11,18,25,0.11);--nb-l2:rgba(11,18,25,0.15);--nb-l3:rgba(11,18,25,0.3);--nb-sh:rgba(20,30,45,0.1);--nb-scroll:#C9D2DD;--nb-link:#0A6E4D;--nb-acc-tx:#0A6E4D;--nb-lil-tx:#6849B8;--nb-blu-tx:#1B5FC2;--nb-wrn-tx:#B93A28;--nb-selfg:#FFFFFF;--nb-aura:0.5;--nb-noise:0.03;--nb-onlive:rgba(11,18,25,0.62);--nb-glow:rgba(111,224,166,0);--nb-glow2:rgba(53,194,176,0.22);--nb-grad-t:linear-gradient(100deg,#1E63C4,#0E9E8E 36%,#0F8C74 64%,#6849B8);--acc:#0A6E4D;--acc-b:rgba(10,110,77,0.38);--acc-f:rgba(10,110,77,0.09);--nb-bar-done:linear-gradient(90deg,#0E9E8E,#0A6E4D);--nb-bar-wip:linear-gradient(90deg,#0E9E8E,#6849B8);--nb-lil-f:rgba(104,73,184,0.09);--nb-lil-b:rgba(104,73,184,0.34);--nb-ghost:rgba(11,18,25,0.46)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nb-bg, #06080B);color:var(--nb-ink, #E8EDF5);transition:background-color .45s ease,color .45s ease;font-family:'Instrument Sans',ui-sans-serif,system-ui,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:var(--nb-link, #7FE0BE);text-decoration:none;transition:color .25s ease}
a:hover{color:var(--nb-ink, #E8EDF5)}
h1,h2,h3,h4{margin:0;font-family:'Bricolage Grotesque','Instrument Sans',sans-serif;font-weight:700;letter-spacing:-0.035em;line-height:1.02}
p{margin:0}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
::selection{background:var(--nb-acc-tx, #6FE0A6);color:var(--nb-selfg, #06080B)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--nb-bg, #06080B)}
::-webkit-scrollbar-thumb{background:var(--nb-scroll, #1E2632);border-radius:20px}
@keyframes nb-drift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(4%,-3%,0) scale(1.12)}100%{transform:translate3d(0,0,0) scale(1)}}
@keyframes nb-drift2{0%{transform:translate3d(0,0,0) scale(1.05)}50%{transform:translate3d(-5%,4%,0) scale(1)}100%{transform:translate3d(0,0,0) scale(1.05)}}
@keyframes nb-flow{0%{left:-14%;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
@keyframes nb-ping{0%{transform:scale(1);opacity:.7}70%{transform:scale(2.6);opacity:0}100%{transform:scale(2.6);opacity:0}}
@keyframes nb-blink{0%,45%{opacity:1}50%,95%{opacity:.15}100%{opacity:1}}
@keyframes nb-scan{0%{top:6%}50%{top:88%}100%{top:6%}}
@keyframes nb-float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}100%{transform:translateY(0)}}
@keyframes nb-rise{0%{opacity:0;transform:translateY(10px)}12%{opacity:1;transform:translateY(0)}88%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-10px)}}
@keyframes nb-sheen{0%{transform:translateX(-120%)}100%{transform:translateX(220%)}}
@keyframes nb-spin{to{transform:rotate(360deg)}}

/* ═══════════════════════════════════════════════════════════════════════════
 * Ce que la maquette faisait en JavaScript.
 *
 * Tout ce qui suit remplace du code qui, dans l'export, recalculait des
 * attributs `style` à chaque changement d'état. Le serveur rend maintenant
 * l'état de DÉPART ; ces règles décrivent tous les autres.
 * ═══════════════════════════════════════════════════════════════════════════ */

/* La navigation : deux barres, une par largeur d'écran. La maquette écoutait
 * `resize` et re-rendait la page — d'où un saut visible au premier rendu.
 *
 * `!important` est nécessaire ici et nulle part ailleurs : les éléments
 * portent leur `display` dans un attribut `style`, qui l'emporte sur la
 * feuille. Le seuil de 1080 px est celui de la maquette (`innerWidth > 1080`). */
@media (max-width: 1080px) {
  [data-nav="large"] { display: none !important }
}
@media (min-width: 1081px) {
  [data-nav="compact"] { display: none !important }
}

/* Le thème. Les deux icônes sont rendues, le CSS choisit — le bouton n'a donc
 * rien à fabriquer, et l'icône est juste avant même que le script ne tourne. */
html[data-theme="light"] [data-theme-icon="sun"] { display: none }
html:not([data-theme="light"]) [data-theme-icon="moon"] { display: none }

/* Les questions fréquentes. La hauteur de repli vaut 340 px, comme dans la
 * maquette : `max-height` doit être une valeur fixe pour que la transition ait
 * quelque chose à interpoler, `auto` ne s'anime pas. */
[data-faq-panel] { max-height: 0; opacity: 0 }
[data-faq-toggle][aria-expanded="true"] + [data-faq-panel] { max-height: 340px; opacity: 1 }
[data-faq-plus] { transform: rotate(0deg) }
[data-faq-toggle][aria-expanded="true"] [data-faq-plus] { transform: rotate(45deg) }

/* Les jalons de la feuille de route.
 *
 * C'est le cœur de la séparation. La maquette pré-mélangeait deux choses dans
 * un seul dégradé : le STATUT du jalon — livré, en cours, à venir — qui est
 * connu du serveur, et sa SÉLECTION, qui est un clic. Le statut arrive ici en
 * variables (`--ph-border`, `--ph-color`) posées sur le bouton au rendu ; la
 * sélection est `aria-pressed`, qui sert en même temps aux lecteurs d'écran.
 * Les deux se composent ci-dessous au lieu d'être recalculés en JavaScript. */
[data-phase] {
  background: linear-gradient(160deg, var(--nb-l2, rgba(255,255,255,0.13)), var(--nb-s1, rgba(255,255,255,0.03)))
}
[data-phase][aria-pressed="true"] {
  background: linear-gradient(160deg, var(--ph-border), var(--nb-lil-b, rgba(180,155,230,0.28)))
}
[data-phase-title] { color: var(--nb-ink, #E8EDF5) }
[data-phase][aria-pressed="true"] [data-phase-title] { color: var(--ph-color) }
[data-phase-link] { color: var(--nb-micro, #8895A6) }
[data-phase][aria-pressed="true"] [data-phase-link] { color: var(--ph-color) }
[data-phase-link-open] { display: none }
[data-phase][aria-pressed="true"] [data-phase-link-idle] { display: none }
[data-phase][aria-pressed="true"] [data-phase-link-open] { display: inline }

/* Les cinq panneaux de détail sont tous rendus ; un seul est visible. Sans
 * JavaScript, c'est celui du jalon en cours — la page reste utile. */
[data-phase-panel][hidden] { display: none }

/* Les pastilles de l'assistant. Même découpage que les jalons : la NATURE de
 * la démonstration — une opération à valider, ou un chiffre lu en base — est
 * connue du serveur et arrive en variables ; la sélection est un clic.
 *
 * Les huit panneaux de résultat sont rendus en entier, chacun avec ses propres
 * couleurs : rien n'est recalculé, on ne fait que déplacer `hidden`. */
[data-demo] {
  --dm-bord: var(--nb-l2, rgba(255,255,255,0.14));
  --dm-bg: transparent;
  --dm-fg: var(--nb-mute2, #9AA6B6)
}
[data-demo][aria-pressed="true"] {
  --dm-bord: var(--dm-tint);
  --dm-bg: var(--dm-fond);
  --dm-fg: var(--dm-tint)
}
/* La mise en page des panneaux vit ICI, et pas dans un attribut `style`.
 *
 * Un `display` en ligne l'emporte sur la feuille : le `display: none` de
 * `[hidden]` ne mordait pas, et les huit panneaux s'empilaient. Même piège que
 * la double navigation plus haut — sauf qu'ici la mise en page peut simplement
 * descendre dans la feuille, ce qui évite un `!important`. */
[data-demo-panel] {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: clamp(18px, 2.6vw, 32px);
  align-items: start
}
[data-demo-panel][hidden] { display: none }

/* Le scanner. Deux cartes, chacune rendue entièrement — photo ET fiche. La
 * maquette n'avait qu'un bloc de texte dont elle réécrivait les six champs à
 * chaque rotation ; ici on montre l'un ou l'autre. Sans JavaScript, la
 * première carte reste lisible au lieu d'un cadre vide. */
[data-scan-card] { display: flex; flex-direction: column; gap: 8px }
[data-scan-slide][hidden], [data-scan-card][hidden] { display: none }
[data-scan-dot] { width: 7px; background: var(--nb-l3, rgba(255,255,255,0.3)) }
[data-scan-dot][aria-pressed="true"] { width: 24px; background: var(--nb-acc-tx, #6FE0A6) }

/* Le filet lumineux qui parcourt les destinations. Son animation est posée au
 * rendu ; il ne reste qu'à l'éteindre pour qui n'en veut pas. */
@media (prefers-reduced-motion: reduce) {
  [data-flow] { display: none }
}

/* Le panneau « Bientôt » de la bêta fermée.
 *
 * Aucun JavaScript : `:target` s'active quand l'URL se termine par `#bientot`,
 * ce que font tous les boutons « Rejoindre ». Fermer, c'est un lien vers `#`.
 *
 * Le panneau est masqué par `display: none` plutôt que par l'opacité : caché,
 * il ne doit être ni cliquable, ni lu par un lecteur d'écran, ni atteignable
 * à la tabulation. Une simple transparence laisserait les trois. */
[data-bientot] { display: none }
[data-bientot]:target {
  display: grid;
  place-items: center;
  position: fixed;
  inset: 0;
  z-index: 100;
  padding: 24px
}
[data-bientot-fond] {
  position: absolute;
  inset: 0;
  background: rgba(4, 6, 10, 0.72);
  backdrop-filter: blur(6px)
}
[data-bientot-carte] {
  position: relative;
  max-width: 520px;
  border-radius: 22px;
  padding: clamp(28px, 4vw, 40px);
  background: linear-gradient(170deg, var(--nb-card, #0B0F15), var(--nb-card2, #080A0E));
  border: 1px solid var(--nb-l2, rgba(255,255,255,0.14));
  box-shadow: 0 40px 110px var(--nb-sh, rgba(0,0,0,0.6))
}

/* Les survols. `style-hover` était une invention de l'exportateur, sans
 * équivalent en HTML : chaque règle retrouve ici sa forme normale. */
[data-h="1"]:hover{color:var(--nb-ink, #E8EDF5);border-color:var(--nb-l3, rgba(255,255,255,0.3))}
[data-h="2"]:hover{transform:translateY(-1px);box-shadow:0 10px 34px rgba(53,194,176,0.42),inset 0 1px 0 rgba(255,255,255,0.45)}
[data-h="3"]:hover{transform:translateY(-2px);box-shadow:0 18px 54px rgba(53,194,176,0.46),inset 0 1px 0 rgba(255,255,255,0.5)}
[data-h="4"]:hover{background:var(--nb-l1, rgba(255,255,255,0.08));border-color:var(--nb-l3, rgba(255,255,255,0.28));color:var(--nb-ink, #FFFFFF)}
[data-h="5"]:hover{border-color:rgba(111,224,166,0.35);background:rgba(111,224,166,0.05)}
[data-h="6"]:hover{background:linear-gradient(160deg,rgba(111,224,166,0.5),rgba(180,155,230,0.2))}
[data-h="7"]:hover{transform:translateY(-2px);box-shadow:0 14px 44px rgba(53,194,176,0.44)}
[data-h="8"]:hover{transform:translateY(-4px)}
[data-h="9"]:hover{transform:translateY(-2px);box-shadow:0 18px 54px rgba(53,194,176,0.45)}
[data-h="10"]:hover{border-color:var(--nb-l2, rgba(255,255,255,0.16))}
[data-h="11"]:hover{transform:translateY(-2px);box-shadow:0 20px 60px rgba(53,194,176,0.5)}
[data-h="12"]:hover{background:var(--nb-s3, rgba(255,255,255,0.07));border-color:var(--nb-l3, rgba(255,255,255,0.3));color:var(--nb-ink, #FFFFFF)}