/* --- tokens/fonts.css --- */
/* HTMS Composites webfonts — extracted from brand book v1.0. IBM Plex Sans + Saira are variable (weight range); IBM Plex Mono is static per weight. */
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-400-cyrillic-ext.woff2') format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-400-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-400-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}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-400-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}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-400-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}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-500-cyrillic-ext.woff2') format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-500-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-500-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}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-500-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}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/ibm-plex-mono-500-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}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/ibm-plex-sans-300-600-cyrillic-ext.woff2') format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/ibm-plex-sans-300-600-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/ibm-plex-sans-300-600-greek.woff2') format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/ibm-plex-sans-300-600-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}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/ibm-plex-sans-300-600-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}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/ibm-plex-sans-300-600-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}
@font-face{font-family:'Saira';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/saira-300-600-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}
@font-face{font-family:'Saira';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/saira-300-600-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}
@font-face{font-family:'Saira';font-style:normal;font-weight:300 600;font-stretch:100%;font-display:swap;src:url('./assets/fonts/saira-300-600-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}

/* --- tokens/colors.css --- */
/* HTMS Composites — colour tokens. Source: Brand Book v1.0, pages 11–13. */
:root{
/* The heat range — five steps, always in this order. Never reversed, reordered or looped. */
--amber:#FFA626; /* medium band */
--ember:#FF6C19; /* transition stop — gradient only, never flat on data */
--flare:#FF330D; /* high band — the core of the range */
--scorch:#FF1940; /* transition stop — gradient only, never flat on data */
--blaze:#F60D65; /* extreme band — smallest share, marks limits. Softened v1.1 (book v1.0: #FF0073, legacy pink: #ED1957) */
/* The ground — three darks */
--navy:#080B22; /* every dark ground */
--steel:#232B54; /* rules, borders, second plies */
--slate:#8A93C4; /* secondary text, labels */
/* Light ground + observed neutrals */
--white:#FFFFFF;
--paper:#F5F5FA; /* the light ground — "the absence of a colour" */
--pale:#D2D8EE; /* body text on dark, pale blocks */
--ink-body:#383C5E; /* body copy on light */
--ink-muted:#5C6494; /* muted copy, captions */
--line:#DADEEE; /* hairlines, card rings on light */
--line-faint:#EEF0F8; /* row hairlines on light */
--line-dark:#232B54; /* hairlines on navy */
--line-dark-faint:#161C40; /* row hairlines on navy */
/* The gradient — amber→blaze at 0° or 90° only. Full range for thin rules and edges. */
--heat-gradient-h:linear-gradient(90deg,var(--amber) 0%,var(--ember) 26%,var(--flare) 52%,var(--scorch) 76%,var(--blaze) 100%);
--heat-gradient-v:linear-gradient(180deg,var(--amber) 0%,var(--ember) 26%,var(--flare) 52%,var(--scorch) 76%,var(--blaze) 100%);
/* Panel gradients — two options for backgrounds and wide expanses (full range reads rainbow at size); left→right preferred */
--heat-gradient-panel-warm-h:linear-gradient(90deg,var(--amber) 0%,var(--ember) 50%,var(--flare) 100%);
--heat-gradient-panel-warm-v:linear-gradient(180deg,var(--amber) 0%,var(--ember) 50%,var(--flare) 100%);
--heat-gradient-panel-hot-h:linear-gradient(90deg,var(--flare) 0%,var(--scorch) 100%);
--heat-gradient-panel-hot-v:linear-gradient(180deg,var(--flare) 0%,var(--scorch) 100%);
/* Semantic aliases */
--surface-page:var(--white);
--surface-dark:var(--navy);
--surface-tint:var(--paper);
--text-heading:var(--navy);
--text-body:var(--ink-body);
--text-muted:var(--ink-muted);
--text-label:var(--slate);
--text-on-dark:var(--white);
--text-body-on-dark:var(--pale);
--text-muted-on-dark:#5C6494;
--accent:var(--flare);
--accent-hover:var(--blaze);
/* Temperature semantics — colour means temperature on data */
--temp-medium:var(--amber);
--temp-high:var(--flare);
--temp-extreme:var(--blaze);
--temp-comparator:var(--slate); /* competitors never get a hot cap */
}

/* --- tokens/typography.css --- */
/* HTMS Composites — type tokens. Source: Brand Book v1.0, page 14. */
:root{
--font-sans:'IBM Plex Sans',sans-serif; /* all headings and text */
--font-mono:'IBM Plex Mono',monospace; /* labels, data, part numbers — never reading text */
--font-logo:'Saira',sans-serif; /* the lockup ONLY, width 108%, 0.12em tracking */
/* Scale */
--size-display:60px;
--size-h1:40px;
--size-h2:27px;
--size-body:17px;
--size-small:14px; /* body never below 14px on screen */
--size-label:11px;
--size-eyebrow:9px;
/* Weights — headings 500; 600 only over imagery; 700 never */
--weight-light:300;
--weight-regular:400;
--weight-medium:500;
--weight-over-image:600;
/* Leading + tracking */
--leading-heading:1.16;
--leading-body:1.62;
--track-heading:0.01em;
--track-label:0.16em;
--track-eyebrow:0.20em;
--track-logo:0.12em;
}

/* --- tokens/spacing.css --- */
/* HTMS Composites — spacing, borders, radii. The book defines no formal scale; these are its observed rhythm. */
:root{
--radius:0; /* everything is cut square — no rounded corners anywhere */
--pad-page:48px; /* page/panel padding */
--pad-card:24px;
--gap-hairline:1px; /* hairline-grid gutters (grid gap 1px over --line) */
--gap-tight:8px;
--gap-grid:14px; /* card grids */
--gap-block:24px;
--gap-section:48px;
--hairline:1px solid var(--line);
--hairline-faint:1px solid var(--line-faint);
--hairline-dark:1px solid var(--line-dark);
--card-ring:0 0 0 1px var(--line); /* cards use a hairline ring, never drop shadows */
--band-h:7px; /* heat-colour top band on cards */
--rule-h:3px; /* short accent rule under product names */
}

/* --- tokens/base.css --- */
/* HTMS Composites — base element styles + interaction states (digital only). Source: Brand Book v1.0, page 13. */
body{font-family:var(--font-sans);color:var(--text-body);background:var(--surface-page);margin:0}
h1,h2,h3,h4{font-weight:var(--weight-medium);color:var(--text-heading);letter-spacing:var(--track-heading)}
a{color:var(--flare);text-decoration:none}
a:hover{color:var(--blaze)}
::selection{background:var(--navy);color:var(--white)}
:focus-visible{outline:1.5px solid var(--blaze);outline-offset:2px}
/* Disabled is slate — never a faded hot colour */
button:disabled,[disabled]{color:var(--slate)}

