:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--hx-bg:#f4f5f3;--hx-surface:#fff;--hx-sunk:#e7eae6;--hx-ink:#16201c;--hx-muted:#58635e;--hx-line:#dadfda;--hx-field:#b9c1bc;--hx-accent:#0e6e6b;--hx-on-accent:#fff;--hx-accent-soft:#e1efed;--hx-ok:#276b45;--hx-warn:#8a5100;--hx-danger:#a63a26;--hx-chart-allow:#8fb8a9;--hx-chart-step:#d9a55b;--hx-chart-block:#b4452f;--hx-focus:0 0 0 3px color-mix(in srgb, var(--hx-accent) 35%, transparent);--hx-font:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--hx-mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--hx-text:15px;--hx-radius:6px;--hx-space:8px}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--hx-bg:#0f1412;--hx-surface:#1a211e;--hx-sunk:#232b27;--hx-ink:#e6ece8;--hx-muted:#9aa69f;--hx-line:#28312c;--hx-field:#3c4842;--hx-accent:#5cc3b7;--hx-on-accent:#0b1513;--hx-accent-soft:#17302c;--hx-ok:#6cc293;--hx-warn:#e0a64b;--hx-danger:#e58a73;--hx-chart-allow:#4e8676;--hx-chart-step:#c9964f;--hx-chart-block:#d9705a}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--hx-bg:#0f1412;--hx-surface:#1a211e;--hx-sunk:#232b27;--hx-ink:#e6ece8;--hx-muted:#9aa69f;--hx-line:#28312c;--hx-field:#3c4842;--hx-accent:#5cc3b7;--hx-on-accent:#0b1513;--hx-accent-soft:#17302c;--hx-ok:#6cc293;--hx-warn:#e0a64b;--hx-danger:#e58a73;--hx-chart-allow:#4e8676;--hx-chart-step:#c9964f;--hx-chart-block:#d9705a}.hx-env-banner{background:var(--hx-sunk);color:var(--hx-warn);border-bottom:1px solid var(--hx-line);font:500 13px/1.4 var(--hx-font);text-align:center;margin:0;padding:4px 16px;display:block}.hx-env-banner strong{font-weight:600}.hx-env-banner .hx-env-host{font-family:var(--hx-mono);overflow-wrap:anywhere;font-size:12.5px}@media (width<=640px){.hx-env-banner .hx-env-note{display:none}}.hx-env-error{border:2px solid var(--hx-danger);background:var(--hx-surface);max-width:46rem;color:var(--hx-ink);font:400 15px/1.5 var(--hx-font);border-radius:8px;margin:48px auto;padding:20px 24px}.hx-env-error h1{color:var(--hx-danger);margin:0 0 8px;font-size:20px;font-weight:600}.hx-env-error p{margin:8px 0}.hx-env-error dl{grid-template-columns:max-content 1fr;gap:4px 16px;margin:12px 0;display:grid}.hx-env-error dt{font-weight:600}.hx-env-error-row{display:contents}.hx-env-error dd{font-family:var(--hx-mono);overflow-wrap:anywhere;margin:0;font-size:14px}@media (width<=640px){.hx-env-error{margin:16px;padding:16px}.hx-env-error dl{grid-template-columns:1fr}.hx-env-error dd{margin-bottom:6px}}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/ibm-plex-sans-latin-ext-400-normal-C5H60-Va.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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:400;font-display:swap;src:url(/assets/ibm-plex-sans-latin-400-normal-CDDApCn2.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,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:500;font-display:swap;src:url(/assets/ibm-plex-sans-latin-ext-500-normal-DakdToA3.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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:500;font-display:swap;src:url(/assets/ibm-plex-sans-latin-500-normal-6ng42L7E.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,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:600;font-display:swap;src:url(/assets/ibm-plex-sans-latin-ext-600-normal-DOrvGEcy.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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:600;font-display:swap;src:url(/assets/ibm-plex-sans-latin-600-normal-CuJfVYMP.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,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:400;font-display:swap;src:url(/assets/ibm-plex-mono-latin-ext-400-normal-DxDDqVQb.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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/ibm-plex-mono-latin-400-normal-Dm_PoFIZ.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,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/ibm-plex-mono-latin-ext-500-normal-Dn-cqWhb.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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/ibm-plex-mono-latin-500-normal-C_OblDzq.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%}body{background:var(--hx-bg);color:var(--hx-ink);font:400 var(--hx-text)/1.55 var(--hx-font);-webkit-font-smoothing:antialiased;margin:0}:focus-visible{outline:2px solid var(--hx-accent);outline-offset:2px}a{color:var(--hx-accent);text-underline-offset:2px}code,pre{font-family:var(--hx-mono)}code{color:var(--hx-ink);overflow-wrap:anywhere;font-size:.88em}.bar{--gutter:max(16px, calc((100% - 1048px) / 2));padding:0 var(--gutter);border-bottom:1px solid var(--hx-line);background:var(--hx-surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:0 20px;display:flex}.brand{align-items:center;gap:8px;padding:14px 0;font-size:15px;font-weight:600;display:inline-flex}.brand .logo{color:var(--hx-accent);flex:none}.brand-sub{color:var(--hx-muted);border-left:1px solid var(--hx-line);padding-left:8px;font-weight:400}.switches{flex-wrap:wrap;gap:8px;display:flex}.seg{border:1px solid var(--hx-line);border-radius:var(--hx-radius);gap:2px;margin:10px 0;padding:2px;display:inline-flex}.seg button{font:inherit;min-width:32px;min-height:26px;color:var(--hx-muted);cursor:pointer;background:0 0;border:0;border-radius:4px;padding:0 10px;font-size:12.5px;line-height:1}.seg button:hover{color:var(--hx-ink)}.seg button[aria-pressed=true]{background:var(--hx-sunk);color:var(--hx-ink);font-weight:500}.intro,main,footer{max-width:1080px;margin:0 auto;padding:0 16px}.intro{padding-top:32px;padding-bottom:4px}h1{letter-spacing:-.02em;margin:0 0 6px;font-size:26px;font-weight:600;line-height:1.25}.intro>p{max-width:68ch;color:var(--hx-muted);margin:0 0 6px}button.link{all:unset;color:var(--hx-accent);text-underline-offset:2px;cursor:pointer;min-height:24px;padding:4px 0;font-size:14px;text-decoration:underline}button.link:focus-visible{outline:2px solid var(--hx-accent);outline-offset:2px;border-radius:2px}#qr{flex-wrap:wrap;align-items:center;gap:12px 16px;margin:8px 0 0;display:flex}#qr p{max-width:46ch;margin:0;font-size:13px}#qr img{border-radius:var(--hx-radius);border:1px solid var(--hx-line);background:#fff;padding:6px}.notice{border-left:3px solid var(--hx-warn);background:var(--hx-sunk);color:var(--hx-ink);border-radius:0 var(--hx-radius) var(--hx-radius) 0;max-width:none;margin:16px 0 0;padding:10px 14px}.tabs{border-bottom:1px solid var(--hx-line);scrollbar-width:thin;overscroll-behavior-x:contain;gap:0 22px;margin-top:20px;display:flex;overflow-x:auto}.tabs [role=tab]{font:inherit;color:var(--hx-muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid #0000;flex:none;margin:0;padding:12px 0 10px;font-size:14px}.tabs [role=tab]:hover{color:var(--hx-ink)}.tabs [role=tab][aria-selected=true]{color:var(--hx-ink);border-bottom-color:var(--hx-accent);font-weight:600}.tabs [role=tab]:focus-visible{outline-offset:-2px}[role=tabpanel]{padding:24px 0 32px}#panel-floating{padding-bottom:140px}[role=tabpanel]:focus-visible{outline-offset:6px;border-radius:2px}h2{letter-spacing:-.01em;margin:0 0 4px;font-size:20px;font-weight:600}.proves{color:var(--hx-ink);margin-bottom:16px}h3{color:var(--hx-muted);letter-spacing:.04em;text-transform:uppercase;margin:28px 0 8px;font-size:13px;font-weight:600}h4{margin:16px 0 4px;font-size:14px;font-weight:600}p{max-width:68ch;color:var(--hx-muted);margin:0 0 12px}.hint{margin:0;font-size:13.5px}ul.plain{color:var(--hx-muted);max-width:68ch;margin:0;padding-left:20px}ul.plain li{margin:4px 0}.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:24px 40px;display:grid}form{gap:14px;max-width:460px;display:grid}.slot{min-width:0}label{gap:6px;font-size:13.5px;font-weight:500;display:grid}input:not([type=radio]):not([type=range]),textarea,select{font:inherit;border:1px solid var(--hx-field);border-radius:var(--hx-radius);background:var(--hx-surface);color:var(--hx-ink);min-height:38px;padding:8px 10px;font-size:15px;font-weight:400}input:focus-visible,textarea:focus-visible,select:focus-visible{border-color:var(--hx-accent);box-shadow:var(--hx-focus);outline:none}input[type=radio],input[type=range]{accent-color:var(--hx-accent)}input[type=range]{width:100%;max-width:260px;min-height:24px}textarea{resize:vertical}.result{border-left:3px solid var(--hx-line);min-height:48px;padding:2px 0 2px 16px}.result[data-kind=ok]{border-left-color:var(--hx-ok)}.result[data-kind=ko]{border-left-color:var(--hx-danger)}.result .verdict{color:var(--hx-ink);margin:0;font-weight:500}.result .verdict:empty:before{content:"—";color:var(--hx-muted);font-weight:400}.steps{color:var(--hx-muted);margin:0 0 8px;padding-left:22px;font-size:14px}.steps:empty{display:none}#bot-result{margin-top:16px}button[type=submit],button.action,a.action,button.secondary{min-height:38px;font:inherit;border:1px solid var(--hx-accent);border-radius:var(--hx-radius);background:var(--hx-accent);color:var(--hx-on-accent);cursor:pointer;justify-self:start;align-items:center;padding:0 16px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}button[type=submit]:hover,button.action:hover,a.action:hover{background:color-mix(in srgb, var(--hx-accent) 88%, var(--hx-ink))}button.secondary,a.action.secondary-link{background:var(--hx-surface);color:var(--hx-ink);border-color:var(--hx-field)}button.secondary:hover,a.action.secondary-link:hover{background:var(--hx-sunk)}button[aria-disabled=true]{opacity:.6;cursor:not-allowed}.row{flex-wrap:wrap;gap:10px;margin:24px 0 8px;display:flex}pre{background:var(--hx-sunk);border-radius:var(--hx-radius);white-space:pre;color:var(--hx-ink);max-width:100%;margin:8px 0 0;padding:12px 14px;font-size:12.5px;line-height:1.55;overflow-x:auto}pre.json{white-space:pre-wrap;word-break:break-all}pre+p{margin-top:12px}.controls{align-content:start;gap:16px;display:grid}fieldset{border:0;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;display:flex}legend{width:100%;margin-bottom:6px;padding:0;font-size:13.5px;font-weight:500}label.choice{cursor:pointer;align-items:center;gap:6px;min-height:24px;font-size:14px;font-weight:400;display:inline-flex}.swatch{border:1px solid var(--hx-line);border-radius:50%;width:14px;height:14px;display:inline-block}output{font-family:var(--hx-mono);color:var(--hx-muted);font-size:13px;font-weight:400}footer{padding-bottom:40px}footer p{border-top:1px solid var(--hx-line);max-width:none;margin:0;padding-top:16px;font-size:13px}footer code{color:var(--hx-muted)}@media (width<=720px){.split{grid-template-columns:minmax(0,1fr)}}@media (width<=640px){.bar{gap:0 12px}.seg{margin:0 0 10px}.intro{padding-top:20px}h1{font-size:22px}.tabs{gap:0 18px;margin-left:-16px;margin-right:-16px;padding:0 16px}}@media (prefers-reduced-motion:no-preference){a,button{transition:background-color .12s,color .12s,border-color .12s}}


/*
 * Harisecurity brand (HEXA_BRAND=harisecurity): the --hx-* tokens take the brand charter's colours. Appended after
 * packages/design-tokens/tokens.css in the built stylesheets by brand-vite.ts (same selectors, so it wins by order);
 * never part of a Harisecurity build. Charter → token: ground → bg, surface, ink, muted, border → line,
 * border-strong → field, orange-strong → accent (text-safe orange; the flat orange #f28c28 never carries text),
 * orange-tint → accent-soft, grenat → danger. sunk and the chart colours are derived (same hue family).
 * Contrast (WCAG 2.2): every text colour ≥ 4.5:1 on bg, surface, sunk and accent-soft, field ≥ 3:1, in both themes
 * (light: muted 5.6–6.6, accent 4.5–5.4, danger 6.3–7.5, on-accent 5.4; dark: muted 5.9–7.9, accent 7.1–9.4,
 * danger 5.1–6.8, field 3.8).
 */
:root {
  --hx-bg: #FAF7F0;
  --hx-surface: #FFFFFF;
  --hx-sunk: #F1EBDD;
  --hx-ink: #102A43;
  --hx-muted: #625C52;
  --hx-line: #E0DACB;
  --hx-field: #857D6F;
  --hx-accent: #A45607;
  --hx-on-accent: #FFFFFF;
  --hx-accent-soft: #FDEBD6;
  --hx-ok: #276B45;
  --hx-warn: #8A5100;
  --hx-danger: #9E2A2B;
  --hx-chart-allow: #8FAFC9;
  --hx-chart-step: #F28C28;
  --hx-chart-block: #9E2A2B;
  --hx-font: 'IBM Plex Sans', 'Noto Sans Arabic', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --hx-bg: #0B1C2E;
    --hx-surface: #12283F;
    --hx-sunk: #1A3350;
    --hx-ink: #F3EFE6;
    --hx-muted: #A3B1C2;
    --hx-line: #213A55;
    --hx-field: #6F8399;
    --hx-accent: #F7B267;
    --hx-on-accent: #0B1C2E;
    --hx-accent-soft: #3A2A14;
    --hx-ok: #6CC293;
    --hx-warn: #E0A64B;
    --hx-danger: #E58A84;
    --hx-chart-allow: #4E6F91;
    --hx-chart-step: #D9893A;
    --hx-chart-block: #E58A84;
  }
}

:root[data-theme="dark"] {
  --hx-bg: #0B1C2E;
  --hx-surface: #12283F;
  --hx-sunk: #1A3350;
  --hx-ink: #F3EFE6;
  --hx-muted: #A3B1C2;
  --hx-line: #213A55;
  --hx-field: #6F8399;
  --hx-accent: #F7B267;
  --hx-on-accent: #0B1C2E;
  --hx-accent-soft: #3A2A14;
  --hx-ok: #6CC293;
  --hx-warn: #E0A64B;
  --hx-danger: #E58A84;
  --hx-chart-allow: #4E6F91;
  --hx-chart-step: #D9893A;
  --hx-chart-block: #E58A84;
}

/* Logo: the cartouche (logo.svg) on light, the inverse mark (mark-inverse.svg) on dark, where the navy cartouche would
   disappear. Both are inlined by brand-vite.ts / BrandLogo, unchanged; the door never mirrors (dir="rtl" included). */
.hx-brand-logo { display: inline-flex; flex: none; width: 28px; height: 28px; direction: ltr; }
.hx-brand-logo svg { width: 100%; height: 100%; display: block; }
.hx-brand-logo .hx-logo-dark { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .hx-brand-logo .hx-logo-light { display: none; }
  :root:not([data-theme="light"]) .hx-brand-logo .hx-logo-dark { display: block; }
}
:root[data-theme="dark"] .hx-brand-logo .hx-logo-light { display: none; }
:root[data-theme="dark"] .hx-brand-logo .hx-logo-dark { display: block; }
@media (forced-colors: active) { .hx-brand-logo { forced-color-adjust: none; } }

/* Wordmark: one word, "Haris" in ink + "ecurity" in the text-safe orange (charter: logotype rule) */
.hx-wordmark { white-space: nowrap; }
.hx-wordmark .hx-wm-ink { color: var(--hx-ink); }
.hx-wordmark .hx-wm-accent { color: var(--hx-accent); }