/* ==========================================================================
   blz-kit.css — the B5 kit (OCI / Redwood patterns; spec 2026-10-08 kit + Team v2 §3)
   ==========================================================================
   Built on the b5-redwood tokens (--b5-*), logical properties only (RTL), light only, no copper (terracotta
   --b5-accent only as the hull waterline of the header / drawer strips). Redwood measurements: breakpoints 600 / 1024 (Redwood's 1440
   is not used: the page is capped at 1392px instead); page margins 0 on phones, 24px from 600px; controls 44px;
   floating-label fields 52px; minimum target 36px; drawer widths S 29rem, M min(40.5rem, 90vw), L min(60.5rem, 90vw),
   XL 90vw, full width below 600px. Stacking: drawers 860, the
   bottom drawer 865 (a drawer opened over another: one above it, set by blz-kit.js, at most 870), kit dialogs 875,
   menus 878, toast 880 — below APEX dialogs (901) so an APEX message shows on top.
   Markup: kit_ui_pkg; behaviour: blz-kit.js. Push blz-kit.css AND blz-kit.min.css (identical bytes).
   1. Base + helpers   2. Buttons   3. Page header   4. Tabs   5. Sections + label / value   6. Fields
   7. Table + list     8. Menus     9. Drawers       10. Dialogs, toast, banner, hold   11. Phone (< 600px)   12. Motion
   ========================================================================== */

/* 1. Base + helpers ---------------------------------------------------------- */
.blz-kit-vh{ position:absolute !important; inline-size:1px; block-size:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; padding:0; margin:-1px; }
.blz-kit{ color:var(--b5-ink); font-family:var(--blz-font); font-size:14px; line-height:1.45; }
@media (min-width:1024px){ .blz-kit{ font-size:15px; } }
.blz-kit [hidden], .blz-kit-drawer[hidden], .blz-kit-menu[hidden]{ display:none !important; }
.blz-kit a{ color:var(--b5-link); text-decoration:none; }
.blz-kit a:hover{ text-decoration:underline; }
.blz-kit :focus:not(:focus-visible){ outline:none; }
.blz-kit-page{ padding-inline:24px; padding-block:0 24px; max-inline-size:1392px; }
html.blz-kit-locked{ overflow:hidden; }

/* status badges (AA text on the soft tints) */
.blz-kit-badge{ display:inline-flex; align-items:center; block-size:22px; padding-inline:8px; border-radius:11px; font-size:12px; font-weight:600; vertical-align:middle; white-space:nowrap;
  background:var(--b5-surface-2); color:var(--b5-ink); }
.blz-kit-badge.is-ok{ background:var(--b5-success-soft); color:var(--b5-success); }
.blz-kit-badge.is-info{ background:var(--b5-info-soft); color:var(--b5-info); }
.blz-kit-badge.is-warn{ background:var(--b5-warning-soft); color:var(--b5-warning); }
.blz-kit-badge.is-danger{ background:var(--b5-danger-soft); color:var(--b5-danger); }
.blz-kit-badge.is-off{ background:var(--b5-surface-2); color:var(--b5-muted); }

/* 2. Buttons (44px; primary = Redwood's dark call to action) ------------------ */
.blz-kit-btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; min-block-size:44px; padding-inline:16px; border-radius:var(--blz-r-control);
  border:1px solid var(--b5-field-border, rgba(11,17,49,.5)); background:var(--b5-panel); color:var(--b5-ink); font:inherit; font-weight:600; cursor:pointer; white-space:nowrap; }
.blz-kit-btn:hover{ background:var(--b5-hover); }
.blz-kit-btn:focus-visible{ outline:2px solid var(--b5-link); outline-offset:2px; }
.blz-kit-btn.is-primary{ background:var(--b5-primary); border-color:var(--b5-primary); color:#FFFFFF; }
.blz-kit-btn.is-primary:hover{ background:var(--b5-primary-hover); }
.blz-kit-btn.is-danger{ background:var(--b5-danger-fill); border-color:var(--b5-danger-fill); color:#FFFFFF; }
.blz-kit-btn.is-quiet{ border-color:transparent; background:transparent; }
.blz-kit-btn.is-quiet:hover{ background:var(--b5-hover); }
.blz-kit-btn.is-icon{ inline-size:44px; padding-inline:0; font-size:18px; }
.blz-kit-btn:disabled, .blz-kit-btn[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; }
/* a button with a reason (kit_ui_pkg btn / menu_button p_reason): inert, the reason under it */
.blz-kit-btnr{ display:inline-flex; flex-direction:column; align-items:flex-start; gap:2px; vertical-align:top; max-inline-size:18rem; }
.blz-kit-btn-why{ color:var(--b5-muted); font-size:12px; line-height:1.35; }

/* 3. Page header (Redwood general overview; sticky; strip 12px / 6px on phones) */
.blz-kit-ph{ position:sticky; inset-block-start:var(--blz-shell-top-h, 0px); z-index:5; background:var(--b5-hover); margin-inline:-24px; }   /* below the shell's fixed header */
.blz-kit-ph-in{ padding:12px 24px 14px; }
.blz-kit-ph-back{ display:inline-flex; align-items:center; gap:6px; min-block-size:36px; font-size:13px; font-weight:600; }
.blz-kit-ph-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.blz-kit-ph-text{ min-inline-size:0; }
.blz-kit-ph-title{ margin:0; font-size:24px; font-weight:600; line-height:1.25; overflow-wrap:anywhere; }
.blz-kit-ph-title .blz-kit-badge{ margin-inline-start:10px; }
.blz-kit-ph-sub{ margin:2px 0 0; color:var(--b5-muted); font-size:13px; }
.blz-kit-ph-actions{ display:flex; flex-wrap:wrap; align-items:flex-start; gap:8px; justify-content:flex-end; }
.blz-kit-ph-actions [data-kit-more]{ display:none; }
/* the Blitzwood hull line, stacked in the block direction (so no RTL variant): navy 7 · white boot stripe 2 · red waterline 3 */
.blz-kit-ph-strip{ block-size:12px; background:linear-gradient(180deg, var(--b5-primary) 0 7px, var(--b5-panel) 7px 9px, var(--b5-accent) 9px 12px); }

/* 4. Tabs ---------------------------------------------------------------------- */
.blz-kit-tabs{ display:flex; gap:24px; margin-inline:-24px; padding-inline:24px; background:var(--b5-panel); border-block-end:1px solid var(--b5-hairline);
  overflow-x:auto; scrollbar-width:none; }
.blz-kit-tabs::-webkit-scrollbar{ display:none; }
.blz-kit-tab{ flex:0 0 auto; min-block-size:44px; padding:0; border:0; background:none; color:var(--b5-muted); font:inherit; font-weight:600; cursor:pointer; box-shadow:inset 0 -3px 0 transparent; }
.blz-kit-tab:hover{ color:var(--b5-ink); }
.blz-kit-tab[aria-selected="true"]{ color:var(--b5-ink); box-shadow:inset 0 -3px 0 var(--b5-ink); }
.blz-kit-tab:focus-visible{ outline:2px solid var(--b5-link); outline-offset:-2px; }
.blz-kit-pane{ padding-block-start:20px; }

/* 5. Sections + label / value rows --------------------------------------------- */
.blz-kit-sec{ margin-block-end:24px; }
.blz-kit-sec-title{ margin:0 0 8px; font-size:16px; font-weight:600; }
.blz-kit-kvs{ display:grid; grid-template-columns:1fr; margin:0; }
@media (min-width:1024px){ .blz-kit-kvs{ grid-template-columns:1fr 1fr; column-gap:32px; } }
.blz-kit-kv{ display:grid; grid-template-columns:minmax(120px, 34%) 1fr; gap:12px; padding-block:10px; border-block-end:1px solid var(--blz-line); }
.blz-kit-kv dt{ font-weight:600; }
.blz-kit-kv dd{ margin:0; display:flex; align-items:center; gap:8px; flex-wrap:wrap; overflow-wrap:anywhere; }
.blz-kit-kv .is-empty{ color:var(--b5-muted); }
.blz-kit-copy{ min-block-size:36px; padding-inline:10px; border:1px solid var(--b5-hairline-strong); border-radius:var(--blz-r-control); background:var(--b5-surface-2); color:var(--b5-ink); font:inherit; font-size:12px; font-weight:600; cursor:pointer; }

/* 6. Fields (floating label inside, 52px; "Required" under the end edge; 3:1 border) */
.blz-kit-form{ display:grid; grid-template-columns:1fr; column-gap:24px; }
@media (min-width:600px){ .blz-kit-form.is-2col{ grid-template-columns:repeat(auto-fill, minmax(18rem, 1fr)); } }
.blz-kit-form .is-wide{ grid-column:1 / -1; }
.blz-kit-fld{ margin-block-end:4px; }
.blz-kit-fld-box{ position:relative; }
.blz-kit-input{ inline-size:100%; min-block-size:44px; padding:6px 12px; border:1px solid var(--b5-field-border, rgba(11,17,49,.5)); border-radius:var(--blz-r-input);
  background:var(--b5-panel); color:var(--b5-ink); font:inherit; font-size:16px; }
.blz-kit-fld .blz-kit-input{ block-size:52px; padding:20px 12px 6px; }
.blz-kit-fld textarea.blz-kit-input{ block-size:auto; min-block-size:96px; padding-block-start:24px; }
.blz-kit-input:focus{ outline:none; border-color:var(--b5-link); box-shadow:0 0 0 1px var(--b5-link); }
.blz-kit-input[readonly], .blz-kit-input:disabled{ background:var(--b5-surface-2); color:var(--b5-muted); }
.blz-kit-fld-label{ position:absolute; inset-inline-start:13px; inset-block-start:15px; color:var(--b5-muted); font-size:16px; pointer-events:none;
  transform-origin:top left; transition:transform .12s, color .12s; }
[dir="rtl"] .blz-kit-fld-label{ transform-origin:top right; }
.blz-kit-fld .blz-kit-input:focus + .blz-kit-fld-label,
.blz-kit-fld .blz-kit-input:not(:placeholder-shown) + .blz-kit-fld-label,
.blz-kit-fld select.blz-kit-input + .blz-kit-fld-label,
.blz-kit-fld.is-filled .blz-kit-fld-label{ transform:translateY(-9px) scale(.75); }
.blz-kit-fld .blz-kit-input:focus + .blz-kit-fld-label{ color:var(--b5-link); }
.blz-kit-fld-meta{ display:flex; justify-content:space-between; gap:12px; min-block-size:20px; font-size:12px; color:var(--b5-muted); }
.blz-kit-fld-req{ margin-inline-start:auto; visibility:hidden; }
.blz-kit-fld.is-required:has(.blz-kit-input:placeholder-shown) .blz-kit-fld-req{ visibility:visible; }
.blz-kit-fld-err{ margin:2px 0 0; color:var(--b5-danger); font-size:13px; font-weight:600; }
.blz-kit-fld.is-invalid .blz-kit-input{ border-color:var(--b5-danger-fill); box-shadow:0 0 0 1px var(--b5-danger-fill); }
.blz-kit-fld-lock{ margin:2px 0 0; color:var(--b5-muted); font-size:13px; }
.blz-kit-tgl{ min-inline-size:0; }   /* a switch and its reason: one cell of a form grid */
.blz-kit-toggle{ display:inline-flex; align-items:center; gap:10px; min-block-size:44px; cursor:pointer; }
.blz-kit-toggle.is-locked{ color:var(--b5-muted); cursor:not-allowed; }
.blz-kit-toggle.is-locked .blz-kit-check{ opacity:.5; cursor:not-allowed; }
.blz-kit-toggle.is-locked + .blz-kit-fld-lock{ margin-block:0 8px; padding-inline-start:28px; }   /* under the label text (18px box + 10px gap) */
.blz-kit-check{ inline-size:18px; block-size:18px; accent-color:var(--b5-link); }

/* 7. Table + list ------------------------------------------------------------------ */
.blz-kit-tbl-bar{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-block-end:8px; }
.blz-kit-search{ flex:1 1 260px; }
.blz-kit-search .blz-kit-input{ font-size:14px; }
.blz-kit-tbl-acts{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.blz-kit-tbl-slot{ display:flex; flex:1 1 auto; flex-wrap:wrap; align-items:center; gap:8px; min-inline-size:0; }   /* cfg.toolbar's own controls */
.blz-kit-tbl-count{ color:var(--b5-muted); font-size:13px; }
.blz-kit-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-block-end:10px; }
.blz-kit-chip{ min-block-size:36px; padding-inline:12px; border:1px solid var(--b5-hairline-strong); border-radius:18px; background:var(--b5-panel); color:var(--b5-ink); font:inherit; font-size:13px; cursor:pointer; }
.blz-kit-chip[aria-pressed="true"]{ background:var(--b5-selected); border-color:var(--b5-link); color:var(--b5-info); font-weight:600; }
.blz-kit-chip-n{ color:var(--b5-muted); font-weight:400; }
.blz-kit-tbl-wrap{ overflow-x:auto; border:1px solid var(--b5-hairline); border-radius:var(--blz-r-card); background:var(--b5-panel); }
.blz-kit-table{ inline-size:100%; border-collapse:collapse; }
.blz-kit-table th, .blz-kit-table td{ padding:10px 12px; text-align:start; border-block-end:1px solid var(--blz-line); vertical-align:middle; }
/* no sticky header row: inside the overflow-x wrapper a sticky th sticks to the wrapper, which never scrolls vertically */
.blz-kit-table th{ background:var(--b5-surface-2); font-weight:600; font-size:13px; white-space:nowrap; }
.blz-kit-table tr.is-selected td{ background:var(--b5-selected); }
.blz-kit-table tbody tr:hover td{ background:var(--b5-hover); }
.blz-kit-table tbody tr.is-selected:hover td{ background:var(--b5-selected); }
.blz-kit-table .is-sel{ inline-size:44px; }
.blz-kit-table .is-menu{ inline-size:52px; text-align:end; }
.blz-kit-table .is-empty td{ padding:24px 12px; color:var(--b5-muted); text-align:center; }
.blz-kit-sort{ display:inline-flex; align-items:center; gap:4px; min-block-size:36px; padding:0; border:0; background:none; font:inherit; font-weight:600; color:inherit; cursor:pointer; }
.blz-kit-sort-ic{ font-size:10px; color:var(--b5-muted); }
.blz-kit-tbl-foot{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; padding-block:10px; color:var(--b5-muted); font-size:13px; }
.blz-kit-tbl-nav{ display:flex; align-items:center; gap:8px; }
.blz-kit-tbl-size{ display:inline-flex; align-items:center; gap:6px; }
.blz-kit-tbl-size .blz-kit-input{ inline-size:auto; min-block-size:36px; padding-block:4px; font-size:13px; }
.blz-kit-list{ list-style:none; margin:0; padding:0; border-block:1px solid var(--b5-hairline); background:var(--b5-panel); }
.blz-kit-li{ display:flex; align-items:center; gap:10px; min-block-size:56px; padding:8px 12px; border-block-end:1px solid var(--blz-line); }
.blz-kit-li.is-selected{ background:var(--b5-selected); }
.blz-kit-li.is-empty{ color:var(--b5-muted); justify-content:center; }
.blz-kit-li-main{ flex:1 1 auto; min-inline-size:0; display:flex; flex-direction:column; }
.blz-kit-li-primary{ font-weight:600; overflow-wrap:anywhere; }
.blz-kit-li-secondary{ color:var(--b5-muted); font-size:13px; overflow-wrap:anywhere; }
.blz-kit-tbl-more{ display:flex; justify-content:center; padding-block:12px; }
/* a read-only row / the table itself focused after the last page of Load more (tabindex -1, set by blz-kit.js) */
.blz-kit-tbl [data-kit-row][tabindex="-1"]:focus-visible, .blz-kit-tbl-wrap:focus-visible, .blz-kit-list:focus-visible{ outline:2px solid var(--b5-link); outline-offset:-2px; }
.blz-kit-selbar{ position:fixed; inset-inline:0; inset-block-end:0; z-index:850; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 16px; padding-block-end:max(10px, env(safe-area-inset-bottom)); background:var(--b5-panel); border-block-start:1px solid var(--b5-hairline-strong); box-shadow:var(--b5-shadow-over); }
.blz-kit-fs{ border:0; margin:0 0 16px; padding:0; }
.blz-kit-fs legend{ font-weight:600; margin-block-end:6px; }
.blz-kit-radio{ display:flex; align-items:center; gap:10px; min-block-size:44px; }
/* Server source (cfg.source; spec 2026-10-12 customers list §3): applied-filter tokens, the select-all banner, busy / error rows */
.blz-kit-tbl-top{ display:block; }
.blz-kit-tbl[aria-busy="true"] .blz-kit-tbl-body{ opacity:.6; transition:opacity .12s; }
.blz-kit-tokens{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-block-end:10px; }
.blz-kit-token{ display:inline-flex; align-items:center; gap:6px; min-block-size:36px; padding-inline:12px; border:1px solid var(--b5-link); border-radius:18px; background:var(--b5-selected); color:var(--b5-link); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.blz-kit-token-x{ color:inherit; font-size:15px; line-height:1; }
.blz-kit-linkbtn{ min-block-size:36px; padding:0 4px; border:0; background:none; color:var(--b5-link); font:inherit; font-size:13px; font-weight:600; text-decoration:underline; cursor:pointer; }
.blz-kit-token:focus-visible, .blz-kit-linkbtn:focus-visible{ outline:2px solid var(--b5-link); outline-offset:2px; }
.blz-kit-tbl-banner{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:6px 12px; margin-block-end:8px; border-radius:var(--blz-r-card); background:var(--b5-info-soft); color:var(--b5-info); font-size:13px; }
.blz-kit-table tbody tr.is-error td, .blz-kit-li.is-error{ background:var(--b5-danger-soft); color:var(--b5-danger); }
.blz-kit-table tbody tr.is-error td{ padding:24px 12px; text-align:center; }
.blz-kit-tbl [data-kit-row]{ cursor:default; }
.blz-kit-cols{ list-style:none; margin:0; padding:0; }
.blz-kit-colrow{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-block-size:48px; border-block-end:1px solid var(--blz-line); cursor:grab; }
.blz-kit-colrow label{ display:flex; align-items:center; gap:10px; }
.blz-kit-colmove{ display:flex; }

/* 8. Menus ---------------------------------------------------------------------------- */
.blz-kit-menu{ box-sizing:border-box; z-index:878; min-inline-size:200px; max-inline-size:min(360px, 92vw); overflow-y:auto; padding-block:4px;
  max-block-size:calc(100vh - 16px); max-block-size:calc(100dvh - 16px);   /* 100vh where dvh is unknown */
  background:var(--b5-panel); border:1px solid var(--b5-hairline); border-radius:var(--blz-r-card); box-shadow:var(--b5-shadow-over); }
.blz-kit-menu-item{ display:flex; flex-direction:column; align-items:flex-start; inline-size:100%; min-block-size:44px; padding:8px 14px; border:0; background:none;
  color:var(--b5-ink); font:inherit; text-align:start; cursor:pointer; }
.blz-kit-menu-item:hover, .blz-kit-menu-item:focus{ background:var(--b5-hover); outline:none; }
.blz-kit-menu-item:focus-visible{ box-shadow:inset 0 0 0 2px var(--b5-link); }
.blz-kit-menu-item[data-kit-danger]{ color:var(--b5-danger); }
.blz-kit-menu-item[aria-disabled="true"]{ color:var(--b5-muted); cursor:not-allowed; }
.blz-kit-menu-why{ font-size:12px; color:var(--b5-muted); }

/* 9. Drawers (side S / M / L / XL, bottom = OCI's Create) ------------------------------- */
.blz-kit-drawer{ position:fixed; inset:0; z-index:860; display:flex; }
.blz-kit-drawer.is-bottom{ z-index:865; inset-block-start:var(--blz-shell-top-h, 0px); }
.blz-kit-drawer-bk{ position:absolute; inset:0; background:var(--blz-overlay); opacity:0; transition:opacity .2s; }
.blz-kit-drawer.is-open .blz-kit-drawer-bk{ opacity:1; }
.blz-kit-drawer-panel{ position:relative; display:flex; flex-direction:column; background:var(--b5-canvas); box-shadow:var(--b5-shadow-over); transition:transform .24s cubic-bezier(.22,.61,.36,1); }
.blz-kit-drawer.is-side .blz-kit-drawer-panel{ margin-inline-start:auto; block-size:100%; inline-size:min(40.5rem, 90vw); transform:translateX(100%); }
[dir="rtl"].blz-kit-drawer.is-side:not(.is-open) .blz-kit-drawer-panel{ transform:translateX(-100%); }   /* F4c UI audit C1: not over the open rule */
.blz-kit-drawer.is-side.is-s .blz-kit-drawer-panel{ inline-size:min(29rem, 90vw); }
.blz-kit-drawer.is-side.is-l .blz-kit-drawer-panel{ inline-size:min(60.5rem, 90vw); }
.blz-kit-drawer.is-side.is-xl .blz-kit-drawer-panel{ inline-size:90vw; }
.blz-kit-drawer.is-bottom .blz-kit-drawer-panel{ inline-size:100%; block-size:100%; margin-block-start:auto; border-radius:var(--blz-r-sheet) var(--blz-r-sheet) 0 0; transform:translateY(100%); }
.blz-kit-drawer.is-bottom.is-sheet .blz-kit-drawer-panel{ block-size:auto; max-block-size:85vh; }
.blz-kit-drawer.is-open .blz-kit-drawer-panel{ transform:none; }
.blz-kit-drawer-head{ display:flex; align-items:center; gap:12px; padding:14px 24px; background:var(--b5-hover); }
.blz-kit-drawer-title{ flex:1 1 auto; margin:0; font-size:20px; font-weight:600; }
.blz-kit-drawer-strip{ block-size:6px; background:linear-gradient(180deg, var(--b5-primary) 0 3px, var(--b5-panel) 3px 4px, var(--b5-accent) 4px 6px); }   /* hull line: navy 3 · white 1 · red 2 */
.blz-kit-x{ inline-size:44px; block-size:44px; border:0; border-radius:var(--blz-r-control); background:transparent; color:var(--b5-ink); font-size:22px; line-height:1; cursor:pointer; }
.blz-kit-x:hover{ background:var(--b5-panel); }
.blz-kit-drawer-body{ flex:1 1 auto; overflow-y:auto; overscroll-behavior:contain; padding:20px 24px; }
.blz-kit-drawer.is-bottom .blz-kit-drawer-body > *{ max-inline-size:90rem; margin-inline:auto; }
.blz-kit-drawer-foot{ display:flex; justify-content:flex-end; align-items:center; gap:12px; min-block-size:4rem; padding:10px 24px; padding-block-end:max(10px, env(safe-area-inset-bottom));
  background:var(--b5-panel); border-block-start:1px solid var(--b5-hairline); }

/* 10. Dialogs, toast, banner, hold ------------------------------------------------------------ */
/* Dialogs (plan A2; spec 2026-10-18 finance accounts §7 — Oracle Redwood's message dialog): 560px (at most 600px / 90vw),
   the hull strip on top (the drawers' .blz-kit-drawer-strip: one rule colours both, Blitzwood's too), padding 28-32,
   radius 8 (--blz-r-sheet), title 20/600, body 15px (Arabic: the RTL root's 15 / 16px, 1.7 — A2R-9), Cancel · <Verb> at
   the inline end; destructive = the red verb only.
   Below 768px (blz-kit.js SHEET_MQ -> .is-sheet) a bottom sheet: full width, the top corners rounded, the buttons full
   width and stacked, Cancel on top. */
.blz-kit-dialog{ position:fixed; inset:0; z-index:875; display:flex; align-items:center; justify-content:center; padding:16px; }
.blz-kit-dialog-bk{ position:absolute; inset:0; background:var(--blz-overlay); }
.blz-kit-dialog-box{ position:relative; box-sizing:border-box; inline-size:560px; max-inline-size:min(600px, 90vw); max-block-size:min(600px, 90vh);
  overflow-x:hidden; overflow-y:auto; background:var(--b5-panel); border-radius:var(--blz-r-sheet); box-shadow:var(--b5-shadow-over);
  color:var(--b5-ink); font-family:var(--blz-font); font-size:15px; line-height:1.5; }
.blz-kit-dialog[dir="rtl"] .blz-kit-dialog-box{ font-size:inherit; line-height:inherit; }   /* Arabic keeps the RTL root's Cairo +1px and 1.7 (b5-redwood.css:409-416): 15px, 16px from 1024px */
.blz-kit-dialog-title{ margin:0; padding:28px 32px 12px; font-size:20px; font-weight:600; line-height:1.35; overflow-wrap:anywhere; }
.blz-kit-dialog-msg{ margin:0; padding:0 32px 16px; color:var(--b5-ink); overflow-wrap:anywhere; }
.blz-kit-dialog-amounts{ display:flex; flex-direction:column; gap:6px; margin-block:0 8px; margin-inline:32px; padding:12px 14px;
  border-radius:var(--blz-r-card); background:var(--b5-surface-2); font-size:14px; }
.blz-kit-dialog-amt{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.blz-kit-dialog-amt dt{ color:var(--b5-muted); }
.blz-kit-dialog-amt dd{ margin:0; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; }
.blz-kit-dialog-amt.is-ok dd{ color:var(--b5-success); }
.blz-kit-dialog-amt.is-danger dd{ color:var(--b5-danger); }
.blz-kit-dialog-amt.is-warn dd{ color:var(--b5-warning); }
.blz-kit-dialog-amt.is-muted dd{ color:var(--b5-muted); }
.blz-kit-dialog-type{ padding-block:4px 0; padding-inline:32px; }
.blz-kit-dialog-foot{ display:flex; justify-content:flex-end; flex-wrap:wrap; gap:12px; padding:16px 32px 28px; }
.blz-kit-dialog.is-sheet{ align-items:flex-end; padding:0; }
.blz-kit-dialog.is-sheet .blz-kit-dialog-box{ inline-size:100%; max-inline-size:none; max-block-size:85vh; max-block-size:85dvh; border-radius:0;
  border-start-start-radius:var(--blz-r-sheet); border-start-end-radius:var(--blz-r-sheet); animation:blz-kit-sheet-in .18s cubic-bezier(.22,.61,.36,1); }
.blz-kit-dialog.is-sheet .blz-kit-dialog-title{ padding:24px 16px 12px; }
.blz-kit-dialog.is-sheet .blz-kit-dialog-msg{ padding:0 16px 16px; }
.blz-kit-dialog.is-sheet .blz-kit-dialog-amounts{ margin-inline:16px; }
.blz-kit-dialog.is-sheet .blz-kit-dialog-type{ padding-inline:16px; }
.blz-kit-dialog.is-sheet .blz-kit-dialog-foot{ flex-direction:column; align-items:stretch; gap:8px; padding-block:16px max(24px, env(safe-area-inset-bottom)); padding-inline:16px; }
.blz-kit-dialog.is-sheet .blz-kit-dialog-foot .blz-kit-btn{ inline-size:100%; }
@keyframes blz-kit-sheet-in{ from{ transform:translateY(100%); } to{ transform:none; } }
/* Toast (A2): 5 s, one at a time, in the top open layer; success = a check mark before the text; an action toast (a
   link-styled action + Close) takes clicks and stays 10 s, waiting while hovered or focused. Its own width (A2R-4: a
   fixed box starting at 50% would shrink to 50vw), a 16px gutter on phones. Inside a drawer it sits above the drawer's
   footer at its real height (A2C-9: blz-kit.js toastLift), centred on a side panel (A2C-10); inside a phone sheet at the
   top of the screen, over the scrim, clear of the sheet (A2C-7); below 768px inside the shell above the bottom tab bar
   (--blz-shell-tab-h). */
.blz-kit-toast{ position:fixed; inset-block-end:24px; inset-inline-start:50%; z-index:880; transform:translateX(-50%); box-sizing:border-box; inline-size:max-content; max-inline-size:min(32rem, calc(100vw - 32px)); padding:12px 16px;
  border-radius:var(--blz-r-card); background:var(--b5-ink); color:#FFFFFF; font-weight:600; opacity:0; pointer-events:none; transition:opacity .2s; }
[dir="rtl"] .blz-kit-toast{ transform:translateX(50%); }
.blz-kit-toast.is-show{ opacity:1; }
.blz-kit-toast.is-error{ background:var(--b5-danger); }
.blz-kit-toast.is-success, .blz-kit-toast.has-act{ display:flex; align-items:center; gap:12px; }
.blz-kit-toast.is-success::before{ content:""; flex:0 0 auto; inline-size:18px; block-size:18px; background:var(--b5-success-soft);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center / contain no-repeat; }
.blz-kit-toast.has-act{ padding-block:6px; padding-inline:16px 6px; }
.blz-kit-toast.has-act.is-show{ pointer-events:auto; }
.blz-kit-toast-msg{ flex:1 1 auto; min-inline-size:0; overflow-wrap:anywhere; }
.blz-kit-toast .blz-kit-toast-act{ flex:0 0 auto; display:inline-flex; align-items:center; min-block-size:36px; padding-inline:6px; border:0; background:none;
  color:var(--b5-selected); font:inherit; font-weight:600; text-decoration:underline; cursor:pointer; }   /* 0,2,0 over .blz-kit a (0,1,1) in a drawer: A2C-1 / A2C-6 */
.blz-kit-toast-x{ flex:0 0 auto; inline-size:36px; block-size:36px; padding:0; border:0; border-radius:var(--blz-r-control); background:transparent;
  color:inherit; font:inherit; font-size:18px; line-height:1; cursor:pointer; }
.blz-kit-toast-x:hover{ background:var(--b5-primary); }
.blz-kit-toast-act:focus-visible, .blz-kit-toast-x:focus-visible{ outline:2px solid #FFFFFF; outline-offset:2px; }
.blz-kit-drawer-panel > .blz-kit-toast{ inset-block-end:calc(var(--blz-kit-foot-h, calc(4rem + env(safe-area-inset-bottom))) + 16px); }   /* A2C-9: the footer's real height (toastLift: below 600px it wraps to two rows) */
.blz-kit-drawer.is-side .blz-kit-drawer-panel > .blz-kit-toast{ position:absolute; max-inline-size:min(32rem, calc(100% - 32px)); }   /* A2C-10: centred on the side panel, not the viewport (the open panel has transform:none); its own 16px gutter inside an S panel */
.blz-kit-dialog.is-sheet .blz-kit-dialog-box > .blz-kit-toast{ inset-block-start:max(16px, env(safe-area-inset-top)); inset-block-end:auto; animation:blz-kit-toast-wait .18s step-end; }   /* A2C-7: over the scrim at the top (a sheet is at most 85dvh), so its title, message, amounts, type-to-confirm field and buttons stay clear; hidden during the 180 ms slide (the box's transform would carry it) */
@keyframes blz-kit-toast-wait{ from{ visibility:hidden; } }
@media (max-width:767.98px){
  html.blz-shell-on body > .blz-kit-toast{ inset-block-end:calc(var(--blz-shell-tab-h, 56px) + env(safe-area-inset-bottom) + 12px); }
}
/* Banner (A2: Redwood's messages banner, section type): first in its host (a drawer's body, a page, a section); error /
   warning / info / success on the soft tints (AA text), an icon, a title, a message, links to the fields, Close. */
.blz-kit-banner{ display:flex; align-items:flex-start; gap:12px; margin-block:0 16px; padding-block:12px; padding-inline:16px 6px;
  border:1px solid var(--b5-hairline-strong); border-radius:var(--blz-r-card); background:var(--b5-surface-2); color:var(--b5-ink); }
.blz-kit-banner.is-error{ border-color:var(--b5-danger-fill); background:var(--b5-danger-soft); --blz-kit-banner-fg:var(--b5-danger);
  --blz-kit-banner-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7v6M12 16.5v.5'/%3E%3C/svg%3E"); }
.blz-kit-banner.is-warning{ border-color:var(--b5-warning-fill); background:var(--b5-warning-soft); --blz-kit-banner-fg:var(--b5-warning);
  --blz-kit-banner-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 22 20.5H2z'/%3E%3Cpath d='M12 10v4.5M12 17.5v.5'/%3E%3C/svg%3E"); }
.blz-kit-banner.is-info{ border-color:var(--b5-info-fill); background:var(--b5-info-soft); --blz-kit-banner-fg:var(--b5-info);
  --blz-kit-banner-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 11v6M12 7.5v.5'/%3E%3C/svg%3E"); }
.blz-kit-banner.is-success{ border-color:var(--b5-success-fill); background:var(--b5-success-soft); --blz-kit-banner-fg:var(--b5-success);
  --blz-kit-banner-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M7.5 12.5l3 3 6-6.5'/%3E%3C/svg%3E"); }
.blz-kit-banner-ic{ flex:0 0 auto; inline-size:20px; block-size:20px; margin-block-start:1px; background:var(--blz-kit-banner-fg, var(--b5-ink));
  -webkit-mask:var(--blz-kit-banner-ic) center / contain no-repeat; mask:var(--blz-kit-banner-ic) center / contain no-repeat; }
.blz-kit-banner-text{ flex:1 1 auto; min-inline-size:0; padding-block-start:1px; }
.blz-kit-banner-title{ margin:0; color:var(--blz-kit-banner-fg, var(--b5-ink)); font-weight:600; overflow-wrap:anywhere; }
.blz-kit-banner-msg{ margin:2px 0 0; overflow-wrap:anywhere; }
.blz-kit-banner-list{ margin:4px 0 0; padding-inline-start:18px; }
.blz-kit-banner-list .blz-kit-linkbtn{ padding-inline:0; text-align:start; }
.blz-kit-banner-x{ flex:0 0 auto; inline-size:36px; block-size:36px; margin-block:-6px; font-size:18px; }
/* Hold to confirm (A2 primitive; phones only, where a feature asks — A6): a 4px bar along the button's block end grows over
   the hold (its duration set by blz-kit.js) in the label's own colour (currentColor — A2R-8: 13.6:1 on the primary, 16.6:1
   on its hover background, which a touch press applies, 4.65:1 on the danger fill, ink on a plain button) and snaps back
   on release; no text selection, callout or scroll gesture on the button (`.blz-native .blz-kit-hold` outranks
   blz-native's `.blz-native button{touch-action:manipulation}` — A2R-3). */
.blz-native .blz-kit-hold, .blz-kit-hold{ position:relative; overflow:hidden; touch-action:none; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.blz-kit-hold-fill{ position:absolute; inset-block-end:0; inset-inline-start:0; block-size:4px; inline-size:0; background:currentColor; pointer-events:none;
  transition-property:inline-size; transition-timing-function:linear; }
.blz-kit-hold.is-holding .blz-kit-hold-fill{ inline-size:100%; }
.blz-kit-hold:not(.is-holding) .blz-kit-hold-fill{ transition-duration:0s !important; }
.blz-kit-hold-label{ position:relative; }
.blz-kit-hold.is-armed{ outline:2px solid var(--b5-link); outline-offset:2px; }

/* 11. Phone (< 600px) ------------------------------------------------------------------------------ */
@media (max-width:599.98px){
  .blz-kit-page{ padding-inline:0; }
  .blz-kit-ph{ margin-inline:0; }
  .blz-kit-ph-in{ padding:10px 16px 12px; }
  .blz-kit-ph-title{ font-size:20px; }
  .blz-kit-ph-strip{ block-size:6px; }
  .blz-kit-ph-actions > .blz-kit-btn:not(.is-primary):not([data-kit-more]){ display:none; }
  .blz-kit-ph-actions > .blz-kit-btnr:has(> .blz-kit-btn:not(.is-primary)){ display:none; }   /* its own rule: no :has, no loss of the one above */
  .blz-kit-ph-actions [data-kit-more]{ display:inline-flex; }
  .blz-kit-tabs{ margin-inline:0; padding-inline:16px; gap:20px; }
  .blz-kit-pane{ padding-inline:16px; }
  .blz-kit-kv{ grid-template-columns:1fr; gap:2px; }
  .blz-kit-tbl.is-phone .blz-kit-tbl-bar{ padding-inline:16px; }
  .blz-kit-pane .blz-kit-tbl.is-phone .blz-kit-tbl-bar,
  .blz-kit-drawer-body .blz-kit-tbl.is-phone .blz-kit-tbl-bar{ padding-inline:0; }   /* the pane / drawer body already insets 16px */
  .blz-kit-search .blz-kit-input{ font-size:16px; }   /* under 16px iOS zooms the page on focus */
  .blz-kit-drawer.is-side .blz-kit-drawer-panel,
  .blz-kit-drawer.is-side.is-s .blz-kit-drawer-panel,
  .blz-kit-drawer.is-side.is-l .blz-kit-drawer-panel,
  .blz-kit-drawer.is-side.is-xl .blz-kit-drawer-panel{ inline-size:100%; }
  .blz-kit-drawer.is-bottom{ inset-block-start:0; }
  .blz-kit-drawer.is-bottom .blz-kit-drawer-panel{ border-radius:0; }
  .blz-kit-drawer-head{ padding:8px 16px; }
  .blz-kit-drawer-body{ padding:16px; }
  .blz-kit-drawer-foot{ padding-inline:16px; flex-wrap:wrap-reverse; row-gap:8px; }   /* F6b UI audit: never clips a button */
  .blz-kit-drawer-foot .blz-kit-btn{ flex:1 1 0; min-inline-size:max-content; }        /* a row break before a squeeze */
}

/* 12. Motion ---------------------------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .blz-kit-drawer-panel, .blz-kit-drawer-bk, .blz-kit-toast, .blz-kit-fld-label{ transition:none; }
  .blz-kit-dialog.is-sheet .blz-kit-dialog-box{ animation:none; }
  .blz-kit-hold-fill{ display:none; }
  .blz-kit-dialog.is-sheet .blz-kit-dialog-box > .blz-kit-toast{ animation:none; }
}