/* BaseCode webfonts. Spec asks for Inter; Figtree (Google Fonts) is used as the shipped substitute — see readme.md "Caveats". */
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/a91782fb-ed62-49e6-bebe-e363e3f4898c.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/deae6c61-f24c-4a45-897e-5bdc14f5c80f.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/da2905f9-0fac-4443-9234-f5ca9ce8aeb1.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/061d9265-b6f1-4745-ba47-49d0783ec92f.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/99112661-7bb1-4a75-9a5b-2b2aefcb75c4.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/eb6c005a-c0f6-4bee-9aac-bd5c985294ef.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/db7b7f3e-1467-40f8-a466-81cf06d7e858.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/3fdcaf99-5e1b-4294-9f79-d1057e3dc9cb.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/722a4ee8-4cf5-4dab-b9b0-88689752ae80.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/627c49d8-14e3-46af-8afe-d4609b99e264.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;
}


/* BaseCode webfonts. Spec asks for Inter; Figtree (Google Fonts) is used as the shipped substitute — see readme.md "Caveats". */
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/fc50db34-e68b-4634-b34a-eb897b904898.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: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/f6d30cfc-69a0-4466-87cb-aadf86ef0676.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/a91782fb-ed62-49e6-bebe-e363e3f4898c.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/deae6c61-f24c-4a45-897e-5bdc14f5c80f.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/da2905f9-0fac-4443-9234-f5ca9ce8aeb1.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/061d9265-b6f1-4745-ba47-49d0783ec92f.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 Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/99112661-7bb1-4a75-9a5b-2b2aefcb75c4.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/eb6c005a-c0f6-4bee-9aac-bd5c985294ef.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/db7b7f3e-1467-40f8-a466-81cf06d7e858.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/3fdcaf99-5e1b-4294-9f79-d1057e3dc9cb.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/722a4ee8-4cf5-4dab-b9b0-88689752ae80.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 Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/627c49d8-14e3-46af-8afe-d4609b99e264.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{
/* neutrals */
--neutral-0:#ffffff;--neutral-25:#fcfcfc;--neutral-50:#fafafa;--neutral-75:#f5f5f5;--neutral-100:#f2f2f2;--neutral-150:#ebebeb;--neutral-200:#d9d9d9;--neutral-300:#b3b3b3;--neutral-400:#8a8a8a;--neutral-500:#666666;--neutral-700:#3b3b3b;--neutral-850:#242424;--neutral-900:#111111;--neutral-950:#000000;
/* feedback (use sparingly) */
--feedback-success:#0d8a43;--feedback-warning:#c58b00;--feedback-danger:#e55252;--feedback-info:#4b86e8;
/* ambient primitives */
--ambient-sunset-1:#f4a25a;--ambient-sunset-2:#d46f57;--ambient-sunset-3:#c8afc6;--ambient-sunset-4:#9c90b4;--ambient-sunset-5:#f7d0a8;
--ambient-forest-1:#23321c;--ambient-forest-2:#517336;--ambient-forest-3:#9a8f34;--ambient-forest-4:#d1c2ac;--ambient-forest-5:#7b9898;
--ambient-ocean-1:#33a6ed;--ambient-ocean-2:#77a9f9;--ambient-ocean-3:#95c0f3;--ambient-ocean-4:#ddeaf7;--ambient-ocean-5:#eef4f8;
--ambient-meadow-1:#64b982;--ambient-meadow-2:#a0d09e;--ambient-meadow-3:#d8dfb9;--ambient-meadow-4:#49865b;--ambient-meadow-5:#f7f6f2;
--ambient-rose-1:#f64b4c;--ambient-rose-2:#ea6d99;--ambient-rose-3:#f4a2c8;--ambient-rose-4:#f9c2d8;--ambient-rose-5:#fff3f7;
--ambient-earth-1:#89563b;--ambient-earth-2:#b57c60;--ambient-earth-3:#c7b5a5;--ambient-earth-4:#a2a7a8;--ambient-earth-5:#2f331a;
/* semantic — light */
--background-canvas:#ffffff;--background-subtle:#fafafa;--background-muted:#f5f5f5;
--surface-primary:#ffffff;--surface-secondary:#fafafa;--surface-tertiary:#f2f2f2;--surface-selected:#ebebeb;--surface-inverse:#111111;
--text-primary:#111111;--text-secondary:#3b3b3b;--text-tertiary:#8a8a8a;--text-disabled:#b3b3b3;--text-inverse:#ffffff;
--icon-primary:#111111;--icon-secondary:#666666;--icon-tertiary:#b3b3b3;--icon-inverse:#ffffff;
--border-subtle:#ebebeb;--border-default:#d9d9d9;--border-strong:#b3b3b3;--border-inverse:rgba(255,255,255,.18);
--interactive-primary-bg:#111111;--interactive-primary-fg:#ffffff;--interactive-secondary-bg:#ffffff;--interactive-secondary-fg:#111111;--interactive-secondary-border:#d9d9d9;--interactive-ghost-bg:transparent;--interactive-ghost-fg:#111111;
--focus-ring:#111111;
color-scheme:light;
}
[data-theme="dark"]{
--background-canvas:#0b0b0b;--background-subtle:#111111;--background-muted:#171717;
--surface-primary:#111111;--surface-secondary:#171717;--surface-tertiary:#1f1f1f;--surface-selected:#242424;--surface-inverse:#ffffff;
--text-primary:#ffffff;--text-secondary:rgba(255,255,255,.78);--text-tertiary:rgba(255,255,255,.54);--text-disabled:rgba(255,255,255,.32);--text-inverse:#111111;
--icon-primary:#ffffff;--icon-secondary:rgba(255,255,255,.7);--icon-tertiary:rgba(255,255,255,.4);--icon-inverse:#111111;
--border-subtle:rgba(255,255,255,.08);--border-default:rgba(255,255,255,.14);--border-strong:rgba(255,255,255,.22);--border-inverse:rgba(0,0,0,.18);
--interactive-primary-bg:#ffffff;--interactive-primary-fg:#111111;--interactive-secondary-bg:#111111;--interactive-secondary-fg:#ffffff;--interactive-secondary-border:rgba(255,255,255,.14);--interactive-ghost-fg:#ffffff;
--focus-ring:#ffffff;
color-scheme:dark;
}

:root{
--font-sans:"Figtree",Inter,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif;
--font-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;
/* scale: size / line-height */
--display-xl-size:48px;--display-xl-line:52px;
--display-l-size:40px;--display-l-line:44px;
--heading-xl-size:32px;--heading-xl-line:38px;
--heading-l-size:24px;--heading-l-line:30px;
--heading-m-size:20px;--heading-m-line:26px;
--body-l-size:18px;--body-l-line:26px;
--body-m-size:16px;--body-m-line:24px;
--body-s-size:14px;--body-s-line:20px;
--label-m-size:13px;--label-m-line:18px;
--caption-size:12px;--caption-line:16px;
/* shorthand fonts */
--type-display-xl:600 var(--display-xl-size)/var(--display-xl-line) var(--font-sans);
--type-display-l:600 var(--display-l-size)/var(--display-l-line) var(--font-sans);
--type-heading-xl:600 var(--heading-xl-size)/var(--heading-xl-line) var(--font-sans);
--type-heading-l:600 var(--heading-l-size)/var(--heading-l-line) var(--font-sans);
--type-heading-m:600 var(--heading-m-size)/var(--heading-m-line) var(--font-sans);
--type-body-l:400 var(--body-l-size)/var(--body-l-line) var(--font-sans);
--type-body-m:400 var(--body-m-size)/var(--body-m-line) var(--font-sans);
--type-body-s:400 var(--body-s-size)/var(--body-s-line) var(--font-sans);
--type-label-m:500 var(--label-m-size)/var(--label-m-line) var(--font-sans);
--type-caption:400 var(--caption-size)/var(--caption-line) var(--font-sans);
--type-mono-s:400 13px/20px var(--font-mono);
--tracking-display:-0.02em; /* @kind other */
--tracking-heading:-0.01em; /* @kind other */
--tracking-body:0; /* @kind other */
}
body{font:var(--type-body-m);color:var(--text-primary);background:var(--background-canvas);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--text-primary);text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:2px}
a:hover{text-decoration-color:var(--text-primary)}

:root{
--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;
--radius-xs:6px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-3xl:32px;--radius-4xl:36px;--radius-full:9999px;
--border-width-default:1px; /* @kind spacing */
--border-width-focus:2px; /* @kind spacing */
/* component sizing */
--control-height-sm:32px;--control-height-md:40px;--control-height-lg:44px;--input-height:48px;
--sidebar-width:260px;--content-max-width:760px;
}

:root{
--shadow-xs:0 1px 2px rgba(0,0,0,.04);--shadow-sm:0 4px 12px rgba(0,0,0,.06);--shadow-md:0 10px 30px rgba(0,0,0,.10);--shadow-lg:0 20px 60px rgba(0,0,0,.14);
--motion-duration-instant:80ms; /* @kind other */
--motion-duration-fast:120ms; /* @kind other */
--motion-duration-normal:180ms; /* @kind other */
--motion-duration-slow:280ms; /* @kind other */
--motion-ease-standard:cubic-bezier(.2,.8,.2,1); /* @kind other */
--motion-ease-enter:cubic-bezier(.16,1,.3,1); /* @kind other */
--motion-ease-exit:cubic-bezier(.7,0,.84,0); /* @kind other */
--pressed-scale:.985; /* @kind other */
--texture-grain-opacity-subtle:.05; /* @kind other */
--texture-grain-opacity-default:.08; /* @kind other */
--texture-grain-opacity-strong:.12; /* @kind other */
--texture-blur-soft:28px; /* @kind other */
--texture-blur-medium:48px; /* @kind other */
--texture-blur-large:72px; /* @kind other */
--texture-saturation-reveal:1.06; /* @kind other */
--texture-contrast-reveal:1.03; /* @kind other */
--texture-grain-image:url("../assets/noise.svg"); /* @kind other */
--texture-grain-size:160px 160px; /* @kind other */
/* reveal gradients */
--reveal-sunset:radial-gradient(circle at 72% 80%,rgba(244,162,90,.90),transparent 28%),radial-gradient(circle at 20% 76%,rgba(212,111,87,.72),transparent 30%),radial-gradient(circle at 32% 18%,rgba(156,144,180,.56),transparent 26%),linear-gradient(135deg,#c6b0c6 0%,#d97c67 54%,#f4a25a 100%); /* @kind color */

--reveal-forest:radial-gradient(circle at 84% 30%,rgba(123,152,152,.55),transparent 24%),radial-gradient(circle at 56% 64%,rgba(154,143,52,.80),transparent 26%),radial-gradient(circle at 18% 24%,rgba(35,50,28,.80),transparent 26%),linear-gradient(145deg,#6f8759 0%,#d1c2ac 42%,#517336 100%); /* @kind color */

--reveal-ocean:radial-gradient(circle at 12% 42%,rgba(51,166,237,.78),transparent 30%),radial-gradient(circle at 58% 20%,rgba(119,169,249,.76),transparent 32%),radial-gradient(circle at 84% 70%,rgba(149,192,243,.58),transparent 28%),linear-gradient(135deg,#eef4f8 0%,#95c0f3 48%,#77a9f9 100%); /* @kind color */

--reveal-meadow:radial-gradient(circle at 16% 74%,rgba(100,185,130,.72),transparent 28%),radial-gradient(circle at 48% 24%,rgba(216,223,185,.90),transparent 26%),radial-gradient(circle at 86% 16%,rgba(160,208,158,.72),transparent 24%),linear-gradient(145deg,#64b982 0%,#d8dfb9 56%,#49865b 100%); /* @kind color */

--reveal-rose:radial-gradient(circle at 20% 30%,rgba(246,75,76,.80),transparent 32%),radial-gradient(circle at 70% 70%,rgba(234,109,153,.70),transparent 30%),radial-gradient(circle at 88% 20%,rgba(249,194,216,.80),transparent 26%),linear-gradient(135deg,#f64b4c 0%,#ea6d99 50%,#f4a2c8 100%); /* @kind color */

--reveal-earth:radial-gradient(circle at 20% 70%,rgba(137,86,59,.80),transparent 30%),radial-gradient(circle at 70% 30%,rgba(199,181,165,.80),transparent 28%),radial-gradient(circle at 90% 80%,rgba(47,51,26,.60),transparent 26%),linear-gradient(135deg,#b57c60 0%,#c7b5a5 50%,#a2a7a8 100%); /* @kind color */

/* component reveal mapping */
--reveal-button-primary:var(--reveal-sunset);--reveal-button-secondary:var(--reveal-forest);--reveal-input-focus:var(--reveal-ocean);--reveal-card-hover:var(--reveal-forest);--reveal-composer-focus:var(--reveal-forest);--reveal-composer-voice:var(--reveal-ocean);--reveal-success:var(--reveal-meadow);
}
@media (prefers-reduced-motion:reduce){:root{--pressed-scale:1; /* @kind other */
--motion-duration-fast:0ms; /* @kind other */
--motion-duration-normal:0ms; /* @kind other */
--motion-duration-slow:0ms; /* @kind other */
}}

/* Reveal utility: monochrome at rest → gradient + grain on state.
   Layer stack: base fill → reveal gradient (::before) → grain (::after) → content. */
.bc-reveal{position:relative;overflow:hidden;isolation:isolate;--reveal-gradient:var(--reveal-sunset); /* @kind color */
--reveal-opacity:0; /* @kind other */
--grain-opacity:var(--texture-grain-opacity-default); /* @kind other */
}
.bc-reveal::before{content:"";position:absolute;inset:0;background:var(--reveal-gradient);opacity:var(--reveal-opacity);transition:opacity var(--motion-duration-fast) var(--motion-ease-standard);z-index:-2;pointer-events:none}
.bc-reveal::after{content:"";position:absolute;inset:0;background-image:var(--texture-grain-image);background-size:var(--texture-grain-size);background-repeat:repeat;mix-blend-mode:soft-light;opacity:calc(var(--reveal-opacity) * var(--grain-opacity) * 4);z-index:-1;pointer-events:none}
.bc-reveal.is-hover,.bc-reveal:hover{--reveal-opacity:.55; /* @kind other */
}
.bc-reveal.is-focus,.bc-reveal:focus-visible{--reveal-opacity:.75; /* @kind other */
}
.bc-reveal.is-active,.bc-reveal:active{--reveal-opacity:1; /* @kind other */
}
.bc-reveal.is-selected{--reveal-opacity:.85; /* @kind other */
}
.bc-reveal.is-processing{--reveal-opacity:.9; /* @kind other */
}
.bc-reveal.is-processing::before{animation:bc-reveal-drift 6s var(--motion-ease-standard) infinite alternate;background-size:160% 160%}
/* is-subtle = monochrome interaction: 5% ink wash on hover, no gradient. Only is-processing brings colour back. */
.bc-reveal.is-subtle{--grain-opacity:0; /* @kind other */
}
.bc-reveal.is-subtle::before{background:var(--text-primary)}
.bc-reveal.is-subtle.is-hover,.bc-reveal.is-subtle:hover{--reveal-opacity:.05; /* @kind other */
}
.bc-reveal.is-subtle.is-focus,.bc-reveal.is-subtle:focus-visible{--reveal-opacity:.05; /* @kind other */
}
.bc-reveal.is-subtle.is-active,.bc-reveal.is-subtle:active{--reveal-opacity:.09; /* @kind other */
}
.bc-reveal.is-subtle.is-selected{--reveal-opacity:0; /* @kind other */
}
.bc-reveal.is-subtle.is-processing{--reveal-opacity:.9; /* @kind other */
--grain-opacity:var(--texture-grain-opacity-default); /* @kind other */
}
.bc-reveal.is-subtle.is-processing::before{background:var(--reveal-gradient)}
/* Text over a live gradient is always white (primary/composer/processing/editorial). is-subtle stays ink-on-neutral. */
.bc-reveal:not(.is-subtle).is-hover,.bc-reveal:not(.is-subtle):hover:not(:disabled),.bc-reveal:not(.is-subtle).is-focus,.bc-reveal:not(.is-subtle):focus-visible,.bc-reveal:not(.is-subtle).is-active,.bc-reveal:not(.is-subtle):active,.bc-reveal:not(.is-subtle).is-selected,.bc-reveal:not(.is-subtle).is-processing,.bc-reveal:not(.is-subtle).is-static{color:#fff}
.bc-reveal.is-strong{--grain-opacity:var(--texture-grain-opacity-strong)}
.bc-reveal.is-static{--reveal-opacity:1; /* @kind other */
}
.bc-reveal.sunset{--reveal-gradient:var(--reveal-sunset)}.bc-reveal.forest{--reveal-gradient:var(--reveal-forest)}.bc-reveal.ocean{--reveal-gradient:var(--reveal-ocean)}.bc-reveal.meadow{--reveal-gradient:var(--reveal-meadow)}.bc-reveal.rose{--reveal-gradient:var(--reveal-rose)}.bc-reveal.earth{--reveal-gradient:var(--reveal-earth)}
.bc-reveal:disabled,.bc-reveal[aria-disabled="true"]{--reveal-opacity:0; /* @kind other */
}
.bc-pressable{transition:transform var(--motion-duration-fast) var(--motion-ease-standard)}.bc-pressable:active:not(:disabled){transform:scale(var(--pressed-scale))}
.bc-row:hover{background:var(--surface-secondary)}
@keyframes bc-reveal-drift{from{background-position:0% 0%}to{background-position:100% 100%}}
@keyframes bc-pulse{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes bc-bar{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes bc-spin{to{transform:rotate(360deg)}}
@keyframes bc-fade-up{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
:focus-visible{outline:var(--border-width-focus) solid var(--focus-ring);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.bc-reveal.is-processing::before{animation:none}}



    html, body { margin: 0; height: 100%; background: #031c26; font-family: Figtree, Inter, -apple-system, sans-serif; color: #fff; }
    a { color: #fff; } a:hover { color: rgba(255,255,255,.72); }
    @media (max-width: 900px) {
      [data-screen-label="BaseCode"] > header, [data-screen-label="BaseCode"] > footer { padding: 20px 24px !important; }
      [data-screen-label="BaseCode"] > .hero-main { gap: 22px !important; padding: 24px 20px 56px !important; }
    }
    @media (max-width: 600px) {
      [data-screen-label="BaseCode"] > header, [data-screen-label="BaseCode"] > footer { padding: 16px 18px !important; }
      [data-screen-label="BaseCode"] > footer { flex-direction: column; align-items: center !important; gap: 6px !important; text-align: center; }
      [data-screen-label="BaseCode"] > .hero-main { gap: 18px !important; padding: 16px 16px 40px !important; }
    }

mascot-anim { display: block; width: 100%; height: 100%; }
mascot-anim > img { width: 100%; height: 100%; }

/* Language selection shares the original quiet, monochrome header. */
.locale-switch { display:flex; align-items:center; gap:3px; padding:3px; border:1px solid rgba(255,255,255,.2); border-radius:999px; background:rgba(3,28,38,.3); flex-shrink:0; }
.locale-switch > svg { margin:0 5px 0 8px; opacity:.72; }
.locale-switch button { appearance:none; border:0; border-radius:999px; background:transparent; color:rgba(255,255,255,.68); padding:7px 10px; font:500 11px/16px "IBM Plex Mono",monospace; cursor:pointer; transition:color .2s,background .2s; }
.locale-switch button:hover { color:#fff; background:rgba(255,255,255,.1); }
.locale-switch button[aria-pressed="true"] { color:#031c26; background:#fff; }
.locale-switch button:focus-visible, mascot-anim:focus-visible { outline:2px solid #fff; outline-offset:5px; }
mascot-anim { border-radius:20px; }
@media (max-width:380px) {
  header { gap:8px !important; }
  header > div:first-child { gap:8px !important; }
  header > div:first-child > span { font-size:19px !important; }
  header > div:first-child > img { height:23px !important; }
  .locale-switch button { padding:7px 8px; }
  .locale-switch > svg { margin-left:5px; margin-right:3px; }
}

/* Shared canvas and horizontal feature rail. */
body { height:auto; }
#page-content { position:relative; }
.page-background { position:fixed; inset:0; z-index:0; pointer-events:none; background:#031c26; }
.background-veil { position:absolute; inset:0; background:#051016; opacity:0; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.hero-main { gap:22px !important; padding:24px 24px 32px !important; }
/* Hero lockup: the mascot pops in centered, then the wordmark fades in beside it.
   Fill mode is backwards so nothing stays attached after the intro: Safari otherwise keeps
   a layer at the mascot's original size and clips it when it grows during interactions. */
.hero-lockup { --mascot-w:clamp(90px,15vmin,152px); display:flex; align-items:center; margin-bottom:clamp(20px,4.5vh,44px); animation:bc-lockup-settle 1.5s backwards; }
.hero-mascot { position:relative; z-index:1; flex:none; width:var(--mascot-w) !important; animation:bc-mascot-in .65s cubic-bezier(.34,1.56,.64,1) backwards; }
.hero-wordmark { position:relative; display:grid; margin:0; text-align:left; padding:.1em .08em .14em calc(var(--mascot-w) * .16); font-size:calc(var(--mascot-w) * .44); font-weight:600; letter-spacing:-.035em; line-height:1; white-space:nowrap; }
.hero-saying { grid-area:1 / 1; display:block; animation:bc-wordmark-out .85s cubic-bezier(.22,1,.36,1) .7s backwards; }
/* Off-screen copy used by hero-sayings.js to measure each phrase at the current font size. */
.hero-saying-measure { position:absolute; top:0; left:0; visibility:hidden; pointer-events:none; }
/* translateX(%) uses the lockup's own width, so this keeps the mascot alone at the center. */
@keyframes bc-lockup-settle { 0%,46% { transform:translateX(calc(50% - var(--mascot-w) / 2)); animation-timing-function:cubic-bezier(.22,1,.36,1); } 100% { transform:none; } }
@keyframes bc-mascot-in { from { opacity:0; transform:translateY(10px) scale(.55); } to { opacity:1; transform:none; } }
/* Same motion as the logo carousel (blur and fade), with no clipping box next to the mascot. */
@keyframes bc-wordmark-out { from { opacity:0; transform:translateX(-24px); filter:blur(8px); } to { opacity:1; transform:none; filter:none; } }
@media (max-width:360px) { .hero-wordmark { font-size:calc(var(--mascot-w) * .4); } }
@media (max-width:600px) { .hero-lockup { margin-bottom:clamp(18px,3.5vh,28px); } }
/* Compact platform downloads share the top navigation. */
.site-header { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 36px; }
.site-brand { display:inline-flex; align-items:center; gap:11px; flex:none; white-space:nowrap; }
.site-brand > img { display:block; width:30px; height:26px; }
.site-brand > span { font-size:21px; font-weight:600; letter-spacing:-.02em; line-height:1; }
.header-actions { display:flex; align-items:center; gap:24px; }
.download-group { display:flex; align-items:center; gap:12px; margin:0; }
.download-options { display:flex; align-items:center; border:1px solid rgba(255,255,255,.22); border-radius:12px; background:rgba(3,28,38,.22); }
.download-button { position:relative; appearance:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; height:38px; margin:0; padding:0 14px; border:0; border-radius:0; background:transparent; color:rgba(255,255,255,.82); font:500 12px/1 Figtree,Inter,-apple-system,sans-serif; white-space:nowrap; cursor:not-allowed; transition:background .22s,color .22s; }
.download-button + .download-button { border-left:1px solid rgba(255,255,255,.16); }
.download-button:first-child { border-radius:11px 0 0 11px; }
.download-button:last-child { border-radius:0 11px 11px 0; }
/* Tooltip balloon: springs down from the button on hover, focus or tap. */
.download-tip { position:absolute; top:calc(100% + 12px); left:50%; z-index:20; width:max-content; max-width:min(210px, calc(100vw - 32px)); padding:8px 12px; border-radius:10px; background:#f7f9fa; color:#0b1b22; box-shadow:0 12px 32px rgba(0,0,0,.3); font:500 12px/1.35 Figtree,Inter,-apple-system,sans-serif; white-space:normal; text-align:center; pointer-events:none; visibility:hidden; opacity:0; filter:blur(3px); transform:translate(-50%,-8px) scale(.86); transform-origin:50% 0; transition:opacity .15s ease, filter .15s ease, transform .2s ease, visibility 0s .2s; }
.download-tip::before { content:""; position:absolute; top:-4px; left:50%; width:10px; height:10px; border-radius:2px; background:inherit; transform:translateX(-50%) rotate(45deg); }
.download-button:hover .download-tip, .download-button:focus-visible .download-tip, .download-button.is-tip-open .download-tip { pointer-events:auto; visibility:visible; opacity:1; filter:none; transform:translate(-50%,0) scale(1); transition:opacity .2s ease .05s, filter .2s ease .05s, transform .5s cubic-bezier(.34,1.56,.64,1) .05s, visibility 0s; }
.download-button.is-tip-dismissed .download-tip { visibility:hidden; opacity:0; }
.download-button:hover { background:rgba(255,255,255,.09); color:#fff; }
.platform-icon { display:block; flex:none; opacity:.88; transition:opacity .22s; }
.download-button:hover .platform-icon { opacity:1; }
@media (max-width:780px) {
 .site-header { display:grid; grid-template-columns:1fr auto; gap:18px 16px; }
 .site-brand { grid-column:1; grid-row:1; }
 .header-actions { display:contents; }
 .site-header .locale-switch { grid-column:2; grid-row:1; justify-self:end; }
 .site-header .download-group { grid-column:1 / -1; grid-row:2; justify-self:center; }
}
@media (max-width:360px) {
 .site-header .download-group { gap:8px; }
 .download-button { height:36px; padding:0 11px; gap:7px; font-size:11.5px; }
 .download-tip { max-width:150px; }
}
.scroll-cue { display:inline-flex; align-items:center; gap:16px; text-decoration:none; }
.scroll-cue > span:last-child { font-size:21px; display:inline-block; transition:transform .25s cubic-bezier(.2,.8,.2,1); }
.scroll-cue:hover > span:last-child,.scroll-cue:focus-visible > span:last-child { transform:translateY(4px); }
.scroll-cue:active > span:last-child { transform:translateY(6px); }
.showcase { position:relative; width:100%; padding:16px 0 24px; }
.showcase-viewport { display:flex; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; }
.capability { position:relative; flex:0 0 100%; width:100%; min-width:0; box-sizing:border-box; display:grid; grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr); gap:40px; align-items:center; min-height:min(640px,calc(100svh - 130px)); padding:28px max(36px,calc((100% - 1280px)/2)) 24px; scroll-snap-align:center; }
.is-looping .showcase-viewport { display:grid; overflow:hidden; scroll-snap-type:none; touch-action:pan-y pinch-zoom; cursor:grab; user-select:none; -webkit-user-select:none; }
.is-looping .capability { grid-area:1 / 1; will-change:transform; }
.showcase-viewport.is-dragging { cursor:grabbing; }
.showcase-viewport:focus { outline:none; }
.showcase-viewport:focus-visible { outline:1px solid rgba(255,255,255,.55); outline-offset:-8px; border-radius:12px; }
.scene-copy h2 { margin:0 0 22px; font-size:clamp(38px,5vw,66px); line-height:1.08; letter-spacing:-.04em; font-weight:500; }
.scene-copy p { max-width:40ch; font-size:18px; line-height:1.5; color:rgba(255,255,255,.76); margin:0; }
.app-capture { position:relative; margin:0; padding-top:20px; min-width:0; overflow:hidden; border-radius:24px; background:#fff; color:#111; }
.capture-signature { position:absolute; z-index:1; top:22px; left:28px; display:inline-flex; align-items:center; gap:9px; font-size:15px; font-weight:600; letter-spacing:-.025em; pointer-events:none; }
.capture-signature img { display:block; width:26px; height:23px; object-fit:contain; }
.app-capture > picture, .app-capture .capture-workspace { display:block; width:100%; height:auto; }
.carousel-controls { display:none; align-items:center; justify-content:space-between; gap:24px; box-sizing:border-box; max-width:1352px; padding:12px 36px 8px; margin:0 auto; }
.is-looping .carousel-controls { display:flex; }
.carousel-help { display:flex; align-items:center; gap:10px; margin:0; font-size:12px; color:rgba(255,255,255,.56); }
.carousel-navigation { display:flex; align-items:center; gap:10px; }
.carousel-count { margin-right:12px; font:12px/1.4 "IBM Plex Mono",monospace; color:rgba(255,255,255,.58); }
.carousel-arrow { display:grid; place-items:center; width:46px; height:46px; padding:0; border:1px solid rgba(255,255,255,.22); border-radius:50%; background:rgba(255,255,255,.06); color:#fff; cursor:pointer; transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s,border-color .2s; }
.carousel-arrow:hover,.carousel-arrow:focus-visible { transform:scale(1.06); background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.45); }
.carousel-arrow:active { transform:scale(.94); }
.carousel-arrow svg { transition:transform .24s cubic-bezier(.2,.8,.2,1); }
.carousel-arrow[data-carousel-prev]:hover svg { transform:translateX(-2px); }
.carousel-arrow[data-carousel-next]:hover svg { transform:translateX(2px); }
.carousel-arrow:focus-visible { outline:2px solid white; outline-offset:4px; }
.locale-switch button { transition:transform .18s cubic-bezier(.2,.8,.2,1),color .2s,background .2s; }
.locale-switch button:hover { transform:scale(1.04); }
.locale-switch button:active { transform:scale(.94); }
.page-footer { position:relative; display:flex; justify-content:space-between; padding:26px 36px; border-top:1px solid #ffffff20; font-size:12px; color:#ffffff70; }
.page-footer a { position:relative; text-decoration:none; color:inherit; transition:color .2s; }
.page-footer a::after { content:""; position:absolute; right:0; bottom:-4px; left:0; height:1px; background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.page-footer a:hover,.page-footer a:focus-visible { color:#fff; }
.page-footer a:hover::after,.page-footer a:focus-visible::after { transform:scaleX(1); }
@media (min-width:761px) and (max-width:1000px) {
 .capability { grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr); gap:28px; }
 .scene-copy h2 { font-size:42px; }
}
@media (max-width:760px) {
 .hero-main { padding:24px 20px 32px !important; }
 .showcase { padding:12px 0 20px; }
 .capability { grid-template-columns:minmax(0,1fr); min-height:min(660px,calc(100svh - 150px)); padding:28px 24px 24px; gap:28px; align-content:center; }
 .scene-copy h2 { font-size:clamp(36px,9vw,52px); margin-bottom:18px; }
 .scene-copy p { font-size:16px; }
 .app-capture { border-radius:16px; }
 .capture-signature { top:10px; left:14px; gap:5px; font-size:10px; }
 .capture-signature img { width:18px; height:16px; }
 .carousel-controls { gap:16px; padding:12px 24px 8px; }
 .carousel-help { max-width:150px; gap:8px; font-size:11px; }
 .carousel-help svg { flex:none; }
 .carousel-navigation { gap:7px; }
 .carousel-count { margin-right:3px; font-size:11px; white-space:nowrap; }
 .carousel-arrow { width:42px; height:42px; flex:none; }
 .page-footer { padding:24px; }
}
@media (prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 .locale-switch button,.carousel-arrow,.carousel-arrow svg,.scroll-cue > span:last-child,.page-footer a,.page-footer a::after,.download-button,.platform-icon,.download-tip { transition:none; }
 .hero-lockup,.hero-mascot,.hero-saying { animation:none; }
 .download-tip { filter:none; transform:translate(-50%,0); }
 .locale-switch button:hover,.locale-switch button:active,.carousel-arrow:hover,.carousel-arrow:active,.carousel-arrow:focus-visible,.carousel-arrow:hover svg,.scroll-cue:hover > span:last-child,.scroll-cue:active > span:last-child { transform:none; }
 .is-looping .capability { will-change:auto; }
}