/* ==========================================================================
   Mr Hookah ERP — UI kit (hk.css).  RTL-first, phone-first, light + dark.
   Brand: deep green #0f5c4d + amber #d99a1b on a warm off-white.
   Conventions: BEM-ish `.hk-block__elem--mod`; logical properties only (margin-inline-*, inset-inline-*);
   no data: URIs and no inline styles anywhere (CSP default-src 'self').
   Contents: 1 fonts · 2 tokens · 3 base · 4 layout · 5 components · 6 utilities · 7 print · 8 reduced motion
   ========================================================================== */

/* 1 — fonts (self-hosted, OFL): IBM Plex Sans Arabic for Arabic, Inter for Latin + digits */
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/ibm-plex-sans-arabic-arabic-700-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.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:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-latin-600-normal.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:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/inter-latin-700-normal.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}

/* 2 — design tokens (light) */
:root{
  color-scheme:light;
  --hk-bg:#f6f3ea;            /* warm off-white page */
  --hk-surface:#fff;          /* cards, inputs, drawer */
  --hk-surface-2:#faf8f2;     /* subtle fills: table head, hover */
  --hk-sunken:#efebe0;        /* skeletons, wells */
  --hk-text:#1c2521;
  --hk-muted:#58655f;
  --hk-border:#e2dccd;
  --hk-border-strong:#cfc7b3;
  --hk-primary:#0f5c4d;       /* deep green */
  --hk-primary-hover:#0b4a3e;
  --hk-primary-soft:#e3f0ec;
  --hk-on-primary:#fff;
  --hk-link:#0f5c4d;          /* primary as TEXT colour (brighter in dark mode) */
  --hk-accent:#d99a1b;        /* amber — fills only; as text use --hk-warn */
  --hk-accent-soft:#fbf0d6;
  --hk-on-accent:#2a1c00;
  --hk-ok:#17784a;   --hk-ok-soft:#e1f3ea;
  --hk-warn:#8f5400; --hk-warn-soft:#fdf0d5;
  --hk-bad:#b3261e;  --hk-bad-soft:#fbe5e3;
  --hk-info:#1d5a9e; --hk-info-soft:#e2edf9;
  --hk-focus:#0f7a64;
  --hk-bar-bg:#0f5c4d; --hk-bar-ink:#fff;     /* top bar */
  --hk-toast-bg:#1f2a26; --hk-toast-ink:#f3f7f4;
  --hk-radius:12px; --hk-radius-sm:9px; --hk-radius-lg:18px;
  --hk-shadow-1:0 1px 2px rgba(28,37,33,.06),0 1px 1px rgba(28,37,33,.04);
  --hk-shadow-2:0 10px 28px -10px rgba(28,37,33,.22),0 2px 6px rgba(28,37,33,.06);
  --hk-shadow-3:0 28px 70px -18px rgba(16,35,29,.45);
  --hk-topbar-h:56px; --hk-bottombar-h:62px; --hk-drawer-w:264px;
  --hk-dir:1;                 /* +1 in RTL, -1 in LTR (off-canvas slide direction) */
  --hk-font:"Inter","IBM Plex Sans Arabic","Segoe UI",Tahoma,"Noto Sans Arabic",system-ui,-apple-system,sans-serif;
}
html[dir="ltr"]{--hk-dir:-1}
/* dark: follows the OS unless the user chose light; the explicit [data-theme=dark] block repeats the same values */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --hk-bg:#0e1311; --hk-surface:#151d1a; --hk-surface-2:#1b2521; --hk-sunken:#0b100e;
    --hk-text:#e8eeea; --hk-muted:#9fb0a7; --hk-border:#2a3833; --hk-border-strong:#3a4b44;
    --hk-primary:#17806a; --hk-primary-hover:#1b9078; --hk-primary-soft:#16332c; --hk-link:#5fd1b5;
    --hk-accent:#e5a92a; --hk-accent-soft:#3a2d10; --hk-on-accent:#241800;
    --hk-ok:#58cc92; --hk-ok-soft:#14332a; --hk-warn:#f0b44c; --hk-warn-soft:#3a2d10;
    --hk-bad:#ff9b92; --hk-bad-soft:#3d1f1d; --hk-info:#8bbdf2; --hk-info-soft:#15293f;
    --hk-focus:#6fe0c5; --hk-bar-bg:#0c2a24; --hk-toast-bg:#e8eeea; --hk-toast-ink:#16201c;
    --hk-shadow-1:0 1px 2px rgba(0,0,0,.4); --hk-shadow-2:0 12px 30px -10px rgba(0,0,0,.6); --hk-shadow-3:0 28px 70px -18px rgba(0,0,0,.8);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --hk-bg:#0e1311; --hk-surface:#151d1a; --hk-surface-2:#1b2521; --hk-sunken:#0b100e;
  --hk-text:#e8eeea; --hk-muted:#9fb0a7; --hk-border:#2a3833; --hk-border-strong:#3a4b44;
  --hk-primary:#17806a; --hk-primary-hover:#1b9078; --hk-primary-soft:#16332c; --hk-link:#5fd1b5;
  --hk-accent:#e5a92a; --hk-accent-soft:#3a2d10; --hk-on-accent:#241800;
  --hk-ok:#58cc92; --hk-ok-soft:#14332a; --hk-warn:#f0b44c; --hk-warn-soft:#3a2d10;
  --hk-bad:#ff9b92; --hk-bad-soft:#3d1f1d; --hk-info:#8bbdf2; --hk-info-soft:#15293f;
  --hk-focus:#6fe0c5; --hk-bar-bg:#0c2a24; --hk-toast-bg:#e8eeea; --hk-toast-ink:#16201c;
  --hk-shadow-1:0 1px 2px rgba(0,0,0,.4); --hk-shadow-2:0 12px 30px -10px rgba(0,0,0,.6); --hk-shadow-3:0 28px 70px -18px rgba(0,0,0,.8);
}

/* 3 — base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hk-topbar-h) + 12px)}
body{margin:0;min-height:100vh;min-height:100dvh;background:var(--hk-bg);color:var(--hk-text);font:400 1rem/1.65 var(--hk-font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{margin:0;line-height:1.35;font-weight:700}
h1{font-size:1.5rem}h2{font-size:1.25rem}h3{font-size:1.0625rem}h4{font-size:1rem}
p{margin:0 0 .75em}
a{color:var(--hk-link);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
img,svg{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
hr{border:0;border-top:1px solid var(--hk-border);margin:1rem 0}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--hk-focus);outline-offset:2px;border-radius:6px}
::selection{background:var(--hk-accent);color:var(--hk-on-accent)}
code,kbd,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;direction:ltr;unicode-bidi:isolate}
.hk-sprite{position:absolute;width:0;height:0;overflow:hidden}
.hk-i{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.25em}
.hk-skip{position:fixed;inset-block-start:.5rem;inset-inline-start:.5rem;z-index:200;padding:.625rem 1rem;border-radius:8px;background:var(--hk-primary);color:var(--hk-on-primary);font-weight:600;transform:translateY(-250%);text-decoration:none}
.hk-skip:focus{transform:none}

/* numbers: Western digits, always left-to-right, isolated so they never scramble inside RTL text */
.hk-num{direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums lining-nums;text-align:end;white-space:nowrap}
.hk-ltr{direction:ltr;unicode-bidi:isolate}

/* 4 — layout: top bar, drawer, shell, bottom bar */
.hk-topbar{position:sticky;inset-block-start:0;z-index:60;display:flex;align-items:center;gap:.125rem;height:var(--hk-topbar-h);padding-inline:.375rem .625rem;background:var(--hk-bar-bg);color:var(--hk-bar-ink);box-shadow:0 1px 0 rgba(0,0,0,.12),var(--hk-shadow-1)}
.hk-brand{display:inline-flex;align-items:center;gap:.625rem;color:inherit;text-decoration:none;font-weight:700;font-size:1.125rem;letter-spacing:0;min-height:44px;padding-inline:.375rem}
.hk-brand img{width:32px;height:32px;border-radius:9px;display:block}
.hk-topbar__slots{margin-inline-start:auto;display:flex;align-items:center;gap:.125rem}
.hk-topbar__slot{display:inline-flex;align-items:center;gap:.25rem;min-width:0}
.hk-env{display:inline-block;margin-inline-start:.5rem;padding:.0625rem .5rem;border-radius:999px;background:var(--hk-accent);color:var(--hk-on-accent);font-size:.75rem;font-weight:700}
.hk-iconbtn{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent}
.hk-iconbtn:hover{background:rgba(255,255,255,.14)}
.hk-iconbtn .hk-i{width:1.375rem;height:1.375rem}
.hk-iconbtn__badge{position:absolute;inset-block-start:5px;inset-inline-end:3px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--hk-accent);color:var(--hk-on-accent);font-size:.6875rem;font-weight:700;line-height:18px;text-align:center;font-variant-numeric:tabular-nums}
.hk-avatar{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--hk-accent);color:var(--hk-on-accent);font-weight:700;font-size:1rem}
.hk-pill{position:relative;display:inline-flex;align-items:center;gap:.4rem;min-height:32px;padding:0 .75rem;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(255,255,255,.1);color:inherit;font-size:.8125rem;font-weight:600;cursor:pointer;text-decoration:none}
.hk-pill::after{content:"";position:absolute;inset:-6px -2px}                      /* 44 px hit area, 32 px look */
.hk-pill__dot{width:.5rem;height:.5rem;border-radius:50%;background:#7fe0a8}
.hk-pill[data-state="syncing"] .hk-pill__dot{background:var(--hk-accent);animation:hk-pulse 1s ease-in-out infinite}
.hk-pill[data-state="offline"] .hk-pill__dot{background:#ffb4ab}
.hk-pill[data-state="error"]{background:var(--hk-bad);border-color:transparent}
.hk-shell{display:flex;align-items:flex-start;min-height:calc(100vh - var(--hk-topbar-h))}
.hk-main{flex:1 1 0;min-width:0;padding:1rem}
.hk-main:focus{outline:none}
.hk-container{width:100%;max-width:1360px;margin-inline:auto}
.hk-container--narrow{max-width:760px}
.hk-drawer{position:fixed;inset-block:0;inset-inline-start:0;z-index:70;width:min(86vw,300px);display:flex;flex-direction:column;background:var(--hk-surface);border-inline-end:1px solid var(--hk-border);box-shadow:var(--hk-shadow-3);overflow-y:auto;overscroll-behavior:contain;transform:translateX(calc(100% * var(--hk-dir)));visibility:hidden;transition:transform .22s ease,visibility 0s linear .22s}
body.hk-nav-open .hk-drawer{transform:none;visibility:visible;transition:transform .22s ease}
.hk-drawer__head{display:flex;align-items:center;justify-content:space-between;min-height:var(--hk-topbar-h);padding-inline:.375rem .5rem;background:var(--hk-bar-bg);color:var(--hk-bar-ink);flex:none}
.hk-scrim{position:fixed;inset:0;z-index:65;background:rgba(10,20,17,.55);opacity:0;visibility:hidden;transition:opacity .2s}
body.hk-nav-open .hk-scrim{opacity:1;visibility:visible}
body.hk-nav-open{overflow:hidden}
.hk-nav{padding:.5rem .625rem 1.5rem;flex:1}
.hk-nav ul{list-style:none;margin:0;padding:0}
.hk-nav__link{position:relative;display:flex;align-items:center;gap:.75rem;min-height:44px;padding:.375rem .75rem;border-radius:10px;color:var(--hk-text);font-weight:500;text-decoration:none}
.hk-nav__link:hover{background:var(--hk-surface-2)}
.hk-nav__link .hk-i{color:var(--hk-muted)}
.hk-nav__link.is-active{background:var(--hk-primary-soft);color:var(--hk-link);font-weight:700}
.hk-nav__link.is-active .hk-i{color:var(--hk-link)}
.hk-nav__link.is-active::before{content:"";position:absolute;inset-block:9px;inset-inline-start:0;width:4px;border-radius:4px;background:var(--hk-accent)}
.hk-nav__sec{margin-top:.5rem}
.hk-nav__sec>summary{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:40px;padding:.25rem .75rem;border-radius:8px;color:var(--hk-muted);font-size:.8125rem;font-weight:700;cursor:pointer;list-style:none;user-select:none}
.hk-nav__sec>summary::-webkit-details-marker{display:none}
.hk-nav__sec>summary:hover{color:var(--hk-text)}
.hk-nav__sec>summary .hk-i{width:1rem;height:1rem;transition:transform .15s}
.hk-nav__sec:not([open])>summary .hk-i{transform:rotate(90deg)}
.hk-drawer__foot{padding:.75rem 1rem 1rem;border-top:1px solid var(--hk-border);color:var(--hk-muted);font-size:.8125rem}
.hk-bottombar{display:none}
@media (max-width:720px){
  html:has(body.has-bottombar){scroll-padding-block-end:calc(var(--hk-bottombar-h) + 12px + env(safe-area-inset-bottom))}
  body.has-bottombar .hk-main{padding-block-end:calc(var(--hk-bottombar-h) + 1.5rem + env(safe-area-inset-bottom))}
  .hk-bottombar{display:flex;position:fixed;inset-inline:0;inset-block-end:0;z-index:50;height:calc(var(--hk-bottombar-h) + env(safe-area-inset-bottom));padding-block-end:env(safe-area-inset-bottom);background:var(--hk-surface);border-top:1px solid var(--hk-border);box-shadow:0 -4px 16px -8px rgba(28,37,33,.2)}
  .hk-bottombar__item{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.125rem;border:0;background:none;color:var(--hk-muted);font-size:.75rem;font-weight:600;line-height:1.25;text-decoration:none;cursor:pointer;position:relative;-webkit-tap-highlight-color:transparent}
  .hk-bottombar__item .hk-i{width:1.5rem;height:1.5rem}
  .hk-bottombar__item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .hk-bottombar__item.is-active{color:var(--hk-link)}
  .hk-bottombar__item.is-active::before{content:"";position:absolute;inset-block-start:0;width:2rem;height:3px;border-radius:0 0 3px 3px;background:var(--hk-accent)}
}
@media (min-width:900px){.hk-main{padding:1.5rem 2rem 2.5rem}}
@media (min-width:1100px){
  .hk-drawer{position:sticky;inset-block-start:var(--hk-topbar-h);inset-inline-start:auto;z-index:1;flex:0 0 var(--hk-drawer-w);width:var(--hk-drawer-w);height:calc(100vh - var(--hk-topbar-h));height:calc(100dvh - var(--hk-topbar-h));transform:none;visibility:visible;box-shadow:none;transition:none}
  .hk-drawer__head,.hk-scrim{display:none}
  body.hk-nav-collapsed .hk-drawer{display:none}
  body.hk-nav-open{overflow:auto}
}
body.hk-bare .hk-drawer,body.hk-bare .hk-bottombar,body.hk-bare .hk-scrim,body.hk-bare [data-hk-drawer-toggle]{display:none!important}
body.hk-bare.has-bottombar .hk-main{padding-block-end:1.5rem}
.hk-banner{display:flex;align-items:center;gap:.625rem;padding:.625rem 1rem;margin-bottom:1rem;border-radius:10px;background:var(--hk-warn-soft);color:var(--hk-warn);font-weight:600}

/* page header */
.hk-pagehead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;margin-bottom:1rem}
.hk-pagehead__sub{margin:.125rem 0 0;color:var(--hk-muted);font-size:.9375rem}
.hk-pagehead__actions{display:flex;flex-wrap:wrap;gap:.5rem}
@media (min-width:900px){h1{font-size:1.625rem}}

/* 5 — components */
/* buttons */
.hk-btn{--hk-btn-bg:var(--hk-surface);--hk-btn-ink:var(--hk-text);--hk-btn-bd:var(--hk-border-strong);display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.5rem 1.125rem;border:1.5px solid var(--hk-btn-bd);border-radius:var(--hk-radius-sm);background:var(--hk-btn-bg);color:var(--hk-btn-ink);font-weight:600;font-size:1rem;line-height:1.3;text-align:center;text-decoration:none;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .12s,border-color .12s,box-shadow .12s,transform .06s}
.hk-btn:hover{--hk-btn-bg:var(--hk-surface-2);--hk-btn-bd:var(--hk-muted)}
.hk-btn:active{transform:translateY(1px)}
.hk-btn--primary{--hk-btn-bg:var(--hk-primary);--hk-btn-ink:var(--hk-on-primary);--hk-btn-bd:var(--hk-primary)}
.hk-btn--primary:hover{--hk-btn-bg:var(--hk-primary-hover);--hk-btn-bd:var(--hk-primary-hover)}
.hk-btn--accent{--hk-btn-bg:var(--hk-accent);--hk-btn-ink:var(--hk-on-accent);--hk-btn-bd:var(--hk-accent)}
.hk-btn--accent:hover{--hk-btn-bg:var(--hk-accent);--hk-btn-bd:var(--hk-on-accent);filter:brightness(1.06)}
.hk-btn--danger{--hk-btn-bg:#b3261e;--hk-btn-ink:#fff;--hk-btn-bd:#b3261e}
.hk-btn--danger:hover{--hk-btn-bg:#951c15;--hk-btn-bd:#951c15}
.hk-btn--ghost{--hk-btn-bg:transparent;--hk-btn-ink:var(--hk-link);--hk-btn-bd:transparent}
.hk-btn--ghost:hover{--hk-btn-bg:var(--hk-primary-soft);--hk-btn-bd:transparent}
.hk-btn--lg{min-height:52px;padding:.75rem 1.5rem;font-size:1.0625rem}
.hk-btn--sm{min-height:36px;padding:.25rem .75rem;font-size:.875rem}
.hk-btn--block{display:flex;width:100%}
.hk-btn--icon{width:44px;padding:0}
.hk-btn:disabled,.hk-btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;transform:none}
.hk-btn[aria-busy="true"]{position:relative;color:transparent;pointer-events:none}
.hk-btn[aria-busy="true"]::after{content:"";position:absolute;inset:0;margin:auto;width:1.15rem;height:1.15rem;border:2.5px solid var(--hk-btn-ink);border-inline-end-color:transparent;border-radius:50%;animation:hk-spin .7s linear infinite}
.hk-spinner{display:inline-block;width:1.15em;height:1.15em;border:2.5px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:hk-spin .7s linear infinite;vertical-align:-.2em}
.hk-inline{display:inline}

/* cards, grid */
.hk-card{background:var(--hk-surface);border:1px solid var(--hk-border);border-radius:var(--hk-radius);box-shadow:var(--hk-shadow-1);padding:1rem;min-width:0}
.hk-card__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.875rem}
.hk-card__title{font-size:1.0625rem;font-weight:700}
.hk-card--flush{padding:0;overflow:hidden}
.hk-card--flush>.hk-card__head{margin:0;padding:.875rem 1rem .5rem}
.hk-card--flush>.hk-toolbar{margin:0;padding:.5rem 1rem .75rem}
.hk-card--flush>.hk-table-wrap{border-width:1px 0 0;border-radius:0}
.hk-card--flush>.hk-pager{margin:.75rem 0}
.hk-card--accent{border-top:3px solid var(--hk-accent)}
.hk-card+.hk-card,.hk-card+.hk-grid,.hk-grid+.hk-card,.hk-grid+.hk-grid,.hk-toolbar+.hk-card{margin-top:1rem}
@media (min-width:900px){.hk-card{padding:1.25rem}.hk-card--flush{padding:0}}
.hk-grid{display:grid;gap:1rem;grid-template-columns:minmax(0,1fr)}
.hk-grid--2,.hk-grid--3{grid-template-columns:minmax(0,1fr)}
.hk-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.hk-grid--tiles{grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr))}
.hk-grid--auto{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
@media (min-width:640px){.hk-grid--2,.hk-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.hk-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.hk-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* fields */
.hk-field{display:flex;flex-direction:column;gap:.375rem;margin-bottom:1rem;min-width:0}
.hk-label{font-weight:600;font-size:.9375rem}
.hk-req{color:var(--hk-bad);margin-inline-start:.25rem}
.hk-input{display:block;width:100%;min-height:46px;padding:.5rem .75rem;border:1.5px solid var(--hk-border-strong);border-radius:var(--hk-radius-sm);background:var(--hk-surface);color:var(--hk-text);transition:border-color .12s,box-shadow .12s}
.hk-input::placeholder{color:var(--hk-muted);opacity:.85}
.hk-input:hover{border-color:var(--hk-muted)}
.hk-input:focus{outline:none;border-color:var(--hk-primary);box-shadow:0 0 0 3px rgba(15,122,100,.28);box-shadow:0 0 0 3px color-mix(in srgb,var(--hk-primary) 28%,transparent)}
.hk-input:disabled,.hk-input[readonly]{background:var(--hk-surface-2);color:var(--hk-muted)}
textarea.hk-input{min-height:6rem;resize:vertical;line-height:1.6}
.hk-num-input{direction:ltr;text-align:end;font-variant-numeric:tabular-nums lining-nums}
.hk-help{color:var(--hk-muted);font-size:.875rem}
.hk-error{display:flex;align-items:flex-start;gap:.375rem;color:var(--hk-bad);font-size:.875rem;font-weight:600}
.hk-error .hk-i{width:1.125rem;height:1.125rem;margin-top:.15rem}
.hk-field.has-error .hk-input{border-color:var(--hk-bad);background:color-mix(in srgb,var(--hk-bad) 6%,var(--hk-surface))}
.hk-check{display:flex;align-items:center;gap:.625rem;min-height:44px;cursor:pointer;font-weight:500}
.hk-check input{width:1.25rem;height:1.25rem;flex:none;accent-color:var(--hk-primary)}
.hk-pw{position:relative}
.hk-pw .hk-input{padding-inline-end:3rem}
.hk-pw__toggle{position:absolute;inset-block:0;inset-inline-end:.125rem;display:grid;place-items:center;width:44px;border:0;background:none;color:var(--hk-muted);cursor:pointer;border-radius:8px}
.hk-pw__toggle:hover{color:var(--hk-text)}
.hk-strength{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--hk-muted)}
.hk-strength__bar{flex:1;height:6px;border-radius:3px;background:var(--hk-sunken);overflow:hidden}
.hk-strength__bar i{display:block;height:100%;width:0;border-radius:3px;background:var(--hk-bad);transition:width .2s,background .2s}
.hk-strength[data-level="2"] .hk-strength__bar i{background:var(--hk-accent)}
.hk-strength[data-level="3"] .hk-strength__bar i{background:var(--hk-ok)}
.hk-form-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem}
fieldset.hk-fieldset{border:1px solid var(--hk-border);border-radius:var(--hk-radius);padding:.75rem 1rem 0;margin:0 0 1rem}
fieldset.hk-fieldset legend{padding-inline:.5rem;font-weight:700}

/* toolbar + search */
.hk-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.75rem}
.hk-toolbar .hk-input{width:auto;min-width:0}
.hk-toolbar__grow{flex:1 1 14rem}
.hk-toolbar .hk-field{margin:0}
.hk-search{position:relative;flex:1 1 15rem;min-width:0}
.hk-search .hk-input{width:100%;padding-inline-start:2.5rem}
.hk-search>.hk-i{position:absolute;inset-block-start:50%;inset-inline-start:.75rem;transform:translateY(-50%);color:var(--hk-muted);pointer-events:none}
.hk-count{color:var(--hk-muted);font-size:.875rem;font-variant-numeric:tabular-nums}

/* menu / popover (details) + segmented control */
.hk-menu{position:relative}
.hk-menu>summary{list-style:none;cursor:pointer}
.hk-menu>summary::-webkit-details-marker{display:none}
.hk-menu__panel{position:absolute;inset-inline-end:0;inset-block-start:calc(100% + .375rem);z-index:80;min-width:15rem;max-width:min(92vw,22rem);padding:.375rem;background:var(--hk-surface);color:var(--hk-text);border:1px solid var(--hk-border);border-radius:12px;box-shadow:var(--hk-shadow-2)}
.hk-menu__head{padding:.5rem .75rem;border-bottom:1px solid var(--hk-border);margin-bottom:.25rem}
.hk-menu__head b{display:block}
.hk-menu__head small{color:var(--hk-muted)}
.hk-menu__item{display:flex;align-items:center;gap:.625rem;width:100%;min-height:44px;padding:.375rem .75rem;border:0;border-radius:8px;background:none;color:inherit;font-weight:500;text-align:start;text-decoration:none;cursor:pointer}
.hk-menu__item:hover{background:var(--hk-surface-2)}
.hk-menu__item--danger{color:var(--hk-bad)}
.hk-menu__sep{height:1px;margin:.25rem 0;background:var(--hk-border)}
.hk-menu__form{margin:0}
.hk-menu__label{display:block;padding:.375rem .75rem 0;color:var(--hk-muted);font-size:.8125rem;font-weight:600}
.hk-seg{display:flex;margin:.375rem .5rem;border:1.5px solid var(--hk-border-strong);border-radius:10px;overflow:hidden}
.hk-seg button{flex:1;min-height:40px;border:0;background:transparent;color:inherit;font-weight:600;font-size:.875rem;cursor:pointer}
.hk-seg button+button{border-inline-start:1.5px solid var(--hk-border-strong)}
.hk-seg button[aria-pressed="true"]{background:var(--hk-primary);color:var(--hk-on-primary)}
.hk-colmenu .hk-menu__panel{max-height:60vh;overflow:auto}

/* table */
.hk-table-wrap{position:relative;overflow:auto;border:1px solid var(--hk-border);border-radius:var(--hk-radius);background:var(--hk-surface);-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.hk-table-wrap.is-sticky{max-height:min(72vh,46rem)}
.hk-table-wrap:focus-visible{outline-offset:-3px}
.hk-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9375rem;font-variant-numeric:tabular-nums}
.hk-table caption{caption-side:top;padding:.5rem .875rem;text-align:start;font-weight:700}
.hk-table th,.hk-table td{padding:.625rem .875rem;text-align:start;vertical-align:middle;border-bottom:1px solid var(--hk-border)}
.hk-table th{position:sticky;inset-block-start:0;z-index:2;background:var(--hk-surface-2);font-size:.875rem;font-weight:700;white-space:nowrap;border-bottom:1.5px solid var(--hk-border-strong)}
.hk-table tbody tr:last-child td{border-bottom:0}
.hk-table tbody tr:hover td{background:var(--hk-surface-2)}
.hk-table tbody tr.is-current td{background:var(--hk-primary-soft)}
.hk-table td.hk-num,.hk-table th.hk-num{text-align:end}
.hk-table th[data-sortable]{cursor:pointer;user-select:none}
.hk-table th[data-sortable]:hover{background:var(--hk-sunken)}
.hk-table th[aria-sort]::after{content:"";display:inline-block;margin-inline-start:.4rem;border:.32rem solid transparent;vertical-align:middle}
.hk-table th[aria-sort="ascending"]::after{border-block-end-color:currentColor;border-block-start-width:0}
.hk-table th[aria-sort="descending"]::after{border-block-start-color:currentColor;border-block-end-width:0}
.hk-table tfoot td{position:sticky;inset-block-end:0;z-index:1;background:var(--hk-surface-2);font-weight:700;border-top:2px solid var(--hk-border-strong);border-bottom:0}
.hk-table--compact th,.hk-table--compact td{padding:.375rem .625rem}
.hk-table .hk-actions{white-space:nowrap;text-align:end;width:1%}
.hk-table td{white-space:nowrap}
.hk-table td.hk-wrap{white-space:normal;min-width:12rem}
.hk-table-noresults{padding:1.5rem 1rem;text-align:center;color:var(--hk-muted)}
@media (max-width:640px){
  .hk-table--cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .hk-table--cards,.hk-table--cards tbody,.hk-table--cards tfoot,.hk-table--cards tr{display:block;width:100%}
  .hk-table--cards tr{padding:.625rem .875rem;border-bottom:1px solid var(--hk-border)}
  .hk-table--cards td{display:block;text-align:end;padding:.2rem 0;border:0!important;background:none!important;white-space:normal;overflow-wrap:anywhere}
  .hk-table--cards td::after{content:"";display:table;clear:both}
  .hk-table--cards td::before{content:attr(data-label);float:inline-start;margin-inline-end:1rem;color:var(--hk-muted);font-size:.875rem;font-weight:500}
  .hk-table--cards td[data-label=""]::before{display:none}
  .hk-table--cards td.hk-actions{width:auto}
  .hk-table--cards tfoot td{position:static}
  .hk-table--cards tfoot td:empty{display:none}
}

/* badges, stat tiles, tabs */
.hk-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.0625rem .625rem;border-radius:999px;background:var(--hk-info-soft);color:var(--hk-info);font-size:.8125rem;font-weight:600;line-height:1.7;white-space:nowrap}
.hk-badge--ok{background:var(--hk-ok-soft);color:var(--hk-ok)}
.hk-badge--warn{background:var(--hk-warn-soft);color:var(--hk-warn)}
.hk-badge--bad{background:var(--hk-bad-soft);color:var(--hk-bad)}
.hk-badge--info{background:var(--hk-info-soft);color:var(--hk-info)}
.hk-badge--muted{background:var(--hk-sunken);color:var(--hk-muted)}
.hk-stat{position:relative;display:flex;flex-direction:column;gap:.125rem;padding:.875rem 1rem .875rem 1rem;padding-inline-start:1.25rem;overflow:hidden;background:var(--hk-surface);border:1px solid var(--hk-border);border-radius:var(--hk-radius);box-shadow:var(--hk-shadow-1);min-width:0}
.hk-stat::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:5px;background:var(--hk-stat-c,var(--hk-primary))}
.hk-stat--ok{--hk-stat-c:var(--hk-ok)}.hk-stat--warn{--hk-stat-c:var(--hk-accent)}.hk-stat--bad{--hk-stat-c:var(--hk-bad)}.hk-stat--info{--hk-stat-c:var(--hk-info)}
.hk-stat__label{color:var(--hk-muted);font-size:.875rem;font-weight:600}
.hk-stat__value{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:.25rem;font-size:clamp(1.3125rem,5.2vw,1.75rem);font-weight:700;line-height:1.25;letter-spacing:-.01em}
.hk-stat__unit{color:var(--hk-muted);font-size:1rem;font-weight:600}
.hk-stat__hint{color:var(--hk-muted);font-size:.8125rem}
.hk-tabs{display:flex;gap:.25rem;margin-bottom:1rem;overflow-x:auto;border-bottom:1px solid var(--hk-border);scrollbar-width:none}
.hk-tabs::-webkit-scrollbar{display:none}
.hk-tab{flex:none;min-height:46px;padding:.5rem 1rem;border:0;border-bottom:3px solid transparent;background:none;color:var(--hk-muted);font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}
.hk-tab:hover{color:var(--hk-text)}
.hk-tab[aria-selected="true"],.hk-tab.is-active{color:var(--hk-link);border-bottom-color:var(--hk-accent)}

/* alerts (flash), empty state, pager, kbd */
.hk-alert{display:flex;align-items:flex-start;gap:.625rem;margin-bottom:1rem;padding:.75rem 1rem;border-radius:10px;border:1px solid transparent;background:var(--hk-info-soft);color:var(--hk-info);font-weight:500}
.hk-alert .hk-i{margin-top:.2rem}
.hk-alert__text{flex:1;min-width:0;color:var(--hk-text)}
.hk-alert--ok{background:var(--hk-ok-soft);color:var(--hk-ok);border-color:color-mix(in srgb,var(--hk-ok) 30%,transparent)}
.hk-alert--warn{background:var(--hk-warn-soft);color:var(--hk-warn);border-color:color-mix(in srgb,var(--hk-warn) 30%,transparent)}
.hk-alert--bad{background:var(--hk-bad-soft);color:var(--hk-bad);border-color:color-mix(in srgb,var(--hk-bad) 30%,transparent)}
.hk-alert--info{border-color:color-mix(in srgb,var(--hk-info) 30%,transparent)}
.hk-alert__close{flex:none;display:grid;place-items:center;width:32px;height:32px;margin:-.25rem 0;border:0;border-radius:8px;background:none;color:inherit;cursor:pointer}
.hk-alert__close:hover{background:rgba(0,0,0,.06)}
.hk-empty{padding:2.5rem 1rem;text-align:center;color:var(--hk-muted)}
.hk-empty__icon{display:inline-grid;place-items:center;width:68px;height:68px;margin-bottom:.875rem;border-radius:50%;background:var(--hk-primary-soft);color:var(--hk-link)}
.hk-empty__icon .hk-i{width:1.9rem;height:1.9rem}
.hk-empty__title{margin-bottom:.25rem;color:var(--hk-text);font-size:1.125rem;font-weight:700}
.hk-empty__hint{max-width:30rem;margin:0 auto 1rem}
.hk-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.375rem;margin:1.25rem 0}
.hk-pager>a,.hk-pager>span{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;min-width:44px;min-height:44px;padding:0 .75rem;border:1px solid var(--hk-border);border-radius:10px;background:var(--hk-surface);color:var(--hk-text);font-weight:600;font-variant-numeric:tabular-nums;text-decoration:none}
.hk-pager a:hover{border-color:var(--hk-primary);color:var(--hk-link)}
.hk-pager [aria-current="page"]{background:var(--hk-primary);border-color:var(--hk-primary);color:var(--hk-on-primary)}
.hk-pager .is-disabled{opacity:.45}
.hk-pager .hk-gap{border-color:transparent;background:none;min-width:24px;padding:0}
.hk-pager .hk-pager__sum{border-color:transparent;background:none;min-width:0;color:var(--hk-muted)}
.hk-kbd{display:inline-block;min-width:1.6rem;padding:0 .4rem;border:1px solid var(--hk-border-strong);border-bottom-width:2px;border-radius:6px;background:var(--hk-surface-2);color:var(--hk-text);font:600 .8125rem/1.6 var(--hk-font);text-align:center;direction:ltr}

/* modal (native <dialog>) */
.hk-modal{width:min(92vw,32rem);max-height:min(88vh,52rem);max-height:min(88dvh,52rem);margin:auto;padding:0;border:0;border-radius:var(--hk-radius-lg);background:var(--hk-surface);color:var(--hk-text);box-shadow:var(--hk-shadow-3);overflow:hidden}
.hk-modal[open]{display:flex;flex-direction:column;animation:hk-pop .16s ease-out}
.hk-modal::backdrop{background:rgba(10,20,17,.55)}
.hk-modal--lg{width:min(94vw,56rem)}
.hk-modal--sm{width:min(92vw,24rem)}
.hk-modal__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.875rem 1.25rem;border-bottom:1px solid var(--hk-border)}
.hk-modal__title{font-size:1.125rem;font-weight:700}
.hk-modal__body{padding:1.25rem;overflow:auto;flex:1 1 auto;white-space:normal}
.hk-modal__foot{display:flex;flex-wrap:wrap;gap:.5rem;padding:.875rem 1.25rem;border-top:1px solid var(--hk-border);background:var(--hk-surface-2)}
@media (max-width:640px){
  .hk-modal{width:100%;max-width:100%;margin:auto 0 0;border-radius:20px 20px 0 0}
  .hk-modal[open]{animation:hk-sheet .2s ease-out}
  .hk-modal__foot .hk-btn{flex:1 1 40%}
}

.hk-confirm__msg{margin:0;white-space:pre-line}
.hk-modal .hk-iconbtn:hover,.hk-alert__close:hover{background:var(--hk-surface-2)}
body:has(dialog.hk-modal[open]){overflow:hidden}

/* toasts */
.hk-toasts{position:fixed;inset-inline:0;inset-block-end:1rem;z-index:120;display:flex;flex-direction:column;align-items:center;gap:.5rem;padding-inline:1rem;pointer-events:none}
body.has-bottombar .hk-toasts{inset-block-end:calc(var(--hk-bottombar-h) + env(safe-area-inset-bottom) + .75rem)}
@media (min-width:721px){body.has-bottombar .hk-toasts{inset-block-end:1rem}}
.hk-toast{pointer-events:auto;display:flex;align-items:flex-start;gap:.625rem;width:max-content;min-width:min(16rem,100%);max-width:min(34rem,100%);padding:.75rem 1rem;border-radius:12px;border-inline-start:5px solid var(--hk-toast-c,var(--hk-info));background:var(--hk-toast-bg);color:var(--hk-toast-ink);box-shadow:var(--hk-shadow-2);font-weight:500;cursor:pointer;animation:hk-toast-in .2s ease-out}
.hk-toast--ok{--hk-toast-c:#3ecb86}.hk-toast--warn{--hk-toast-c:var(--hk-accent)}.hk-toast--bad{--hk-toast-c:#ff6b5e}.hk-toast--info{--hk-toast-c:#6fb2f2}
.hk-toast .hk-i{margin-top:.2rem;color:var(--hk-toast-c)}
.hk-toast.is-leaving{opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}

/* skeleton loaders */
.hk-skeleton{position:relative;display:block;min-height:1em;overflow:hidden;border-radius:8px;background:var(--hk-sunken)}
.hk-skeleton::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--hk-surface) 70%,transparent),transparent);transform:translateX(-100%);animation:hk-shimmer 1.3s infinite}
.hk-skeleton--line{height:1rem;margin:.5rem 0}
.hk-skeleton--title{height:1.5rem;width:45%;margin-bottom:.75rem}
.hk-skeleton--block{height:6rem}
.hk-skeleton--row{height:2.75rem;margin:.375rem 0}

/* home tiles */
.hk-tile{display:flex;flex-direction:column;gap:.625rem;min-height:7rem;padding:1rem;border:1px solid var(--hk-border);border-radius:var(--hk-radius);background:var(--hk-surface);box-shadow:var(--hk-shadow-1);color:var(--hk-text);text-decoration:none;transition:transform .12s,box-shadow .12s,border-color .12s}
.hk-tile:hover{transform:translateY(-2px);border-color:var(--hk-primary);box-shadow:var(--hk-shadow-2)}
.hk-tile__icon{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:var(--hk-primary-soft);color:var(--hk-link)}
.hk-tile__icon .hk-i{width:1.5rem;height:1.5rem}
.hk-tile__title{font-size:1.0625rem;font-weight:700;line-height:1.35}
.hk-section-title{margin:1.5rem 0 .75rem;color:var(--hk-muted);font-size:.9375rem;font-weight:700}
.hk-hello{margin-bottom:1.25rem}
.hk-hello h1{font-size:1.5rem}
.hk-hello p{margin:.125rem 0 0;color:var(--hk-muted)}

/* auth + error pages */
.hk-auth{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:1rem;background:radial-gradient(48rem 26rem at 100% -8%,color-mix(in srgb,var(--hk-primary) 16%,transparent),transparent 60%),radial-gradient(36rem 22rem at -8% 108%,color-mix(in srgb,var(--hk-accent) 20%,transparent),transparent 60%),var(--hk-bg)}
.hk-auth__card{width:min(100%,26rem);padding:1.75rem 1.5rem;background:var(--hk-surface);border:1px solid var(--hk-border);border-radius:var(--hk-radius-lg);box-shadow:var(--hk-shadow-2)}
@media (min-width:480px){.hk-auth__card{padding:2rem 2rem}}
.hk-auth__brand{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-bottom:1.5rem;text-align:center}
.hk-auth__brand img{width:76px;height:76px;border-radius:20px;box-shadow:var(--hk-shadow-2)}
.hk-auth__brand h1{font-size:1.5rem}
.hk-auth__brand p{margin:0;color:var(--hk-muted);font-size:.9375rem}
.hk-auth__foot{margin-top:1.25rem;text-align:center;color:var(--hk-muted);font-size:.875rem}
.hk-auth__msg .hk-alert{margin-bottom:1rem}
.hk-errorpage{max-width:34rem;margin:2rem auto;text-align:center}
.hk-errorpage__code{display:inline-block;margin-bottom:.25rem;font-size:4.5rem;font-weight:700;line-height:1;color:var(--hk-accent);font-variant-numeric:tabular-nums;direction:ltr}
.hk-errorpage__icon{display:inline-grid;place-items:center;width:76px;height:76px;margin-bottom:.75rem;border-radius:50%;background:var(--hk-primary-soft);color:var(--hk-link)}
.hk-errorpage__icon .hk-i{width:2.25rem;height:2.25rem}
.hk-errorpage h1{margin-bottom:.5rem}
.hk-errorpage p{color:var(--hk-muted)}
.hk-errorpage__hint{margin:1rem 0 1.5rem;padding:.75rem 1rem;border-radius:10px;background:var(--hk-surface-2);border:1px dashed var(--hk-border-strong);color:var(--hk-text)!important;text-align:start}
.hk-errorpage__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}
.hk-errorpage__ref{margin-top:1.25rem;font-size:.8125rem}

/* 6 — utilities */
.hk-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.hk-stack{display:flex;flex-direction:column;gap:1rem}
.hk-grow{flex:1 1 auto;min-width:0}
.hk-spacer{flex:1}
.hk-muted{color:var(--hk-muted)}
.hk-ok{color:var(--hk-ok)}.hk-warn{color:var(--hk-warn)}.hk-bad{color:var(--hk-bad)}
.hk-bold{font-weight:700}
.hk-nowrap{white-space:nowrap}
.hk-center{text-align:center}
.hk-mt{margin-top:1rem}.hk-mb{margin-bottom:1rem}.hk-mt0{margin-top:0}
.hk-w100{width:100%}
.hk-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hk-print-only{display:none}
@media (max-width:640px){.hk-hide-sm{display:none!important}}
@media (min-width:641px){.hk-show-sm{display:none!important}}

/* keyframes */
@keyframes hk-spin{to{transform:rotate(360deg)}}
@keyframes hk-pulse{50%{opacity:.35}}
@keyframes hk-shimmer{to{transform:translateX(100%)}}
@keyframes hk-pop{from{opacity:0;transform:translateY(8px) scale(.98)}}
@keyframes hk-sheet{from{transform:translateY(100%)}}
@keyframes hk-toast-in{from{opacity:0;transform:translateY(10px)}}

/* touch: even the compact controls are >= 44 px (declared late so it wins over the base rules above) */
@media (max-width:720px),(pointer:coarse){.hk-btn--sm,.hk-seg button,.hk-nav__sec>summary{min-height:44px}}

/* 7 — print (A4, clean, black on white, no chrome) */
@media print{
  @page{size:A4;margin:12mm}
  :root,:root[data-theme="dark"],:root:not([data-theme="light"]){color-scheme:light;--hk-bg:#fff;--hk-surface:#fff;--hk-surface-2:#f3f3f3;--hk-text:#000;--hk-muted:#444;--hk-border:#bdbdbd;--hk-border-strong:#8a8a8a;--hk-link:#000;--hk-primary-soft:#eee;--hk-shadow-1:none;--hk-shadow-2:none}
  html,body{background:#fff!important;color:#000}
  body{font-size:11pt;line-height:1.5}
  .hk-topbar,.hk-drawer,.hk-bottombar,.hk-scrim,.hk-toasts,.hk-toolbar,.hk-pager,.hk-skip,.hk-banner,.hk-alert__close,.hk-noprint,.hk-btn,.hk-tabs,[data-hk-drawer-toggle]{display:none!important}
  .hk-shell{display:block;min-height:0}
  .hk-main{padding:0!important}
  .hk-container{max-width:none}
  .hk-card,.hk-stat{box-shadow:none;border-color:#bdbdbd;break-inside:avoid}
  .hk-table-wrap{max-height:none!important;overflow:visible!important;border-color:#bdbdbd;border-radius:0}
  .hk-table{font-size:10pt}
  .hk-table th,.hk-table tfoot td{position:static}
  .hk-table thead{display:table-header-group}
  .hk-table tfoot{display:table-footer-group}
  .hk-table tr{break-inside:avoid}
  .hk-badge{border:1px solid #888;background:none!important;color:#000!important}
  a{color:inherit;text-decoration:none}
  .hk-print-only{display:block}
  .hk-printhead{display:flex!important;justify-content:space-between;align-items:flex-end;margin-bottom:8mm;padding-bottom:3mm;border-bottom:2px solid #000}
}

/* 8 — reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}