/* ==========================================================================================================================
   0. account-ui.css: one look for the account area (cont.html), taken from "Lucru" (work.css). Spec: UI-KIT.md.
   Load order (cont.html): brand.css, account.css, control-panel.css, architecture.css, account-topnav.css, account-ui.css,
   work.css. account-ui.js (window.IGovUI) writes the markup the tier A rules expect.

   Tiers
   - Tokens (section 1): --ui-* on body.brand-page.account-page, so every panel, dialog and toast can use them.
   - Tier A, kit components (section 4): body.brand-page.account-page #dashboard .ui-x = (1,3,1); modifiers and states add a
     class, attribute or pseudo-class (1,4,1)+ and follow their base rule. !important only on what brand.css forces
     (background, colour, borders, radius, shadow, fonts, text-decoration, outline).
   - Tier B, legacy mapping (section 5): body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))
     :where(<legacy selector>) = (1,2,1) + !important. It ties with brand.css:252 and wins by load order, always loses to tier A
     (a panel can mix migrated and legacy markup) and never matches Lucru (#workPanel). Element rules skip kit-classed (ui-*)
     and Lucru-classed (w-*) elements inside the :where().
   - Panel rules (section 6, K-34), Lucru deltas (7, now in work.css), toasts (8, K-31), responsive, reduced motion, forced
     colours (9), the components the phase-2 pages added (10: switch, tag field, listbox, dialog error band).
   No global resets on legacy markup: kit containers reset their own children only. CSP: no inline styles anywhere; data:
   URIs only here. Lucru is untouched except section 2, the only declaration of its --w-* tokens.
   ========================================================================================================================== */

/* 1. Tokens (UI-KIT 2.1) */
body.brand-page.account-page{
  --ui-ink:#101828;--ui-text:#344054;--ui-text-2:#475467;--ui-muted:#667085;--ui-faint:#98a2b3;--ui-disabled:#c0c6cf;
  --ui-line:#e3e8ef;--ui-line-strong:#d0d5dd;--ui-line-hover:#c4cad3;--ui-field-hover:#b3bac5;
  --ui-bg:#fff;--ui-subtle:#f8fafc;--ui-hover:#f2f4f7;--ui-selected:#f5f8ff;
  --ui-accent:#1d4fbf;--ui-accent-hover:#1a45a8;--ui-accent-soft:#eef3ff;--ui-accent-line:#c7d7fe;--ui-drop:#98b2f5;
  --ui-danger:#d92d20;--ui-danger-text:#b42318;--ui-danger-soft:#fef3f2;--ui-danger-line:#fecdca;--ui-danger-dot:#f04438;
  --ui-warning:#f79009;--ui-warning-text:#93370d;--ui-warning-strong:#b54708;--ui-warning-soft:#fffaeb;--ui-warning-line:#fedf89;--ui-warning-icon:#dc6803;
  --ui-success:#067647;--ui-success-soft:#ecfdf3;--ui-success-line:#abefc6;
  --ui-info:#2e90fa;--ui-info-text:#175cd3;--ui-info-soft:#eff8ff;--ui-progress:#6941c6;--ui-progress-soft:#f4f3ff;
  --ui-font:var(--ig-sans,system-ui,-apple-system,'Segoe UI',sans-serif);--ui-mono:var(--ig-mono,ui-monospace,monospace);
  --ui-fs-xs:11px;--ui-fs-sm:12px;--ui-fs-md:13px;--ui-fs:14px;--ui-fs-lg:15px;--ui-fs-dialog:17px;--ui-fs-title:20px;--ui-lh:1.45;
  --ui-r-xs:4px;--ui-r-sm:6px;--ui-r:8px;--ui-r-lg:12px;--ui-r-sheet:16px;--ui-r-pill:999px;
  --ui-s1:4px;--ui-s2:8px;--ui-s3:12px;--ui-s4:16px;--ui-s5:20px;--ui-s6:24px;--ui-s8:32px;
  --ui-h-sm:28px;--ui-h:32px;--ui-h-field:36px;--ui-h-tab:40px;--ui-h-touch:40px;
  --ui-focus-ring:2px solid var(--ui-accent);--ui-focus-offset:2px;
  --ui-shadow-menu:0 12px 24px -8px rgba(16,24,40,.18),0 2px 4px rgba(16,24,40,.06);
  --ui-shadow-dialog:0 24px 48px -12px rgba(16,24,40,.3);--ui-backdrop:rgba(16,24,40,.45);
  --ui-sticky-top:120px;
  /* The steppers (4.24 .ui-steps, the job card's .mon-steps, Lucru's .w-steps) draw done marks, rings and connectors from one
     set of values, Lucru's: a done mark is a #17b26a disc, every ring 2px, a connector --ui-line (--ui-success-line after a done
     step). */
  --ui-step-done:#17b26a;--ui-step-ring:2px;--ui-step-line:var(--ui-line);--ui-step-line-done:var(--ui-success-line)
}
@media(max-width:900px){body.brand-page.account-page{--ui-sticky-top:72px}}

/* 2. Aliases (K-35): the only declaration of Lucru's --w-* tokens (work.css takes them from here), so a palette change is made
   once. The phase-2 pages (Reguli de lucru, the monitoring templates) are on the kit and read --ui-* only. (2,2,1). */
body.brand-page.account-page #dashboard #workPanel{
  --w-ink:var(--ui-ink);--w-text:var(--ui-text);--w-muted:var(--ui-muted);--w-faint:var(--ui-faint);--w-line:var(--ui-line);
  --w-line-strong:var(--ui-line-strong);--w-subtle:var(--ui-subtle);--w-hover:var(--ui-hover);--w-accent:var(--ui-accent);
  --w-accent-hover:var(--ui-accent-hover);--w-accent-soft:var(--ui-accent-soft);--w-accent-line:var(--ui-accent-line);
  --w-critical:var(--ui-danger);--w-warning:var(--ui-warning);--w-info:var(--ui-info);--w-ok:var(--ui-success);--w-font:var(--ui-font);
  --w-step-done:var(--ui-step-done);--w-step-ring:var(--ui-step-ring);--w-step-line:var(--ui-step-line);--w-step-line-done:var(--ui-step-line-done)}

/* 3. Base */
/* One focus ring (work.css:9 recipe) instead of brand.css:580-581's yellow. (0,3,1): a component that keeps a fill or a colour
   on focus does so with its own (1,2,1)+ rule. Fields use offset 0, tabs and menu items -2px. */
body.brand-page.account-page :where(#dashboard,.account-toasts) :focus-visible{outline:2px solid var(--ui-accent)!important;outline-offset:2px!important;box-shadow:none!important;background-color:transparent!important;color:inherit!important;text-decoration:none!important}
/* Kit containers reset their own children only; spacing comes from gap. :where() keeps the reset (1,2,1) under every
   component rule (1,3,1), so .ui-summary, .ui-kicker or .ui-empty-text keep their own margins. */
body.brand-page.account-page #dashboard :where(.ui-head,.ui-row,.ui-card,.ui-empty,.ui-alert,.ui-offer,.ui-dialog,.ui-section,.ui-details,.ui-dl,.ui-facts,.ui-form,.ui-timeline,.ui-table,.ui-list) :where(h2,h3,h4,p,dl,dd,ol,ul){margin:0}
body.brand-page.account-page #dashboard :where(.ui-head,.ui-row,.ui-card,.ui-empty,.ui-alert,.ui-offer,.ui-dialog,.ui-section,.ui-details,.ui-dl,.ui-facts,.ui-form,.ui-timeline,.ui-table,.ui-list) :where(h2,h3,h4){letter-spacing:0;text-transform:none}
/* Base text of legacy sections: 14px/1.45 like Lucru, instead of brand.css:505's 17px. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)){color:var(--ui-text);font:400 14px/1.45 var(--ui-font)}

/* ==========================================================================================================================
   4. Tier A: kit components. Each one is Lucru's w-* piece with the same values (UI-KIT 4).
   ========================================================================================================================== */

/* 4.22 Utilities and icons. .ui-sr, .ui-ico and .ui-collapse work anywhere on the account page (top bar and toasts too). */
body.brand-page.account-page .ui-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body.brand-page.account-page .ui-ico{display:block;flex:none;width:16px;height:16px}
/* IGovUI.icon(name,{size}) sets width/height; component rules below (1,3,1)+ still size icons by context. */
body.brand-page.account-page .ui-ico[width="12"]{width:12px;height:12px}
body.brand-page.account-page .ui-ico[width="13"]{width:13px;height:13px}
body.brand-page.account-page .ui-ico[width="14"]{width:14px;height:14px}
body.brand-page.account-page .ui-ico[width="18"]{width:18px;height:18px}
body.brand-page.account-page .ui-ico[width="20"]{width:20px;height:20px}
body.brand-page.account-page .ui-ico[width="24"]{width:24px;height:24px}
body.brand-page.account-page #dashboard .ui-muted{color:var(--ui-faint)}
body.brand-page.account-page #dashboard .ui-mono{font-family:var(--ui-mono);font-size:12px;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-num{font-variant-numeric:tabular-nums}
body.brand-page.account-page #dashboard .ui-measure{max-width:640px}
body.brand-page.account-page #dashboard .ui-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
body.brand-page.account-page #dashboard .ui-actions.is-end{justify-content:flex-end}
body.brand-page.account-page #dashboard .ui-actions.is-center{justify-content:center}
body.brand-page.account-page #dashboard .ui-region{container:uiregion/inline-size;min-width:0;scroll-margin-top:calc(var(--ui-sticky-top) + 16px);transition:opacity .15s}
body.brand-page.account-page #dashboard .ui-region[aria-busy=true]{opacity:.6}
body.brand-page.account-page #dashboard .ui-text{margin:0;color:var(--ui-text);font-size:14px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-prose{margin:0;color:var(--ui-text);font-size:15px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-sep{color:var(--ui-faint)}

/* 4.6 Buttons (= .w-btn, work.css:16-28 + stage-p2 work.css:436-443) */
body.brand-page.account-page #dashboard .ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;margin:0;padding:0 12px;border:1px solid var(--ui-line-strong)!important;border-radius:6px!important;background:#fff!important;color:var(--ui-text)!important;font:500 14px/1.2 var(--ui-font)!important;text-align:center;text-decoration:none!important;text-transform:none;letter-spacing:0;white-space:nowrap;cursor:pointer;box-shadow:none!important;transition:background-color .15s,border-color .15s,color .15s}
body.brand-page.account-page #dashboard .ui-btn:hover:not(:disabled){background:var(--ui-hover)!important;border-color:var(--ui-line-hover)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-btn:disabled{opacity:.5;cursor:not-allowed;color:var(--ui-text)!important}
body.brand-page.account-page #dashboard .ui-btn[aria-disabled=true]{opacity:.55;cursor:not-allowed}
body.brand-page.account-page #dashboard .ui-btn[aria-disabled=true]:hover{background:#fff!important;border-color:var(--ui-line-strong)!important;color:var(--ui-text)!important}
body.brand-page.account-page #dashboard .ui-btn-primary{background:var(--ui-accent)!important;border-color:var(--ui-accent)!important;color:#fff!important;font-weight:600!important}
body.brand-page.account-page #dashboard .ui-btn-primary:hover:not(:disabled){background:var(--ui-accent-hover)!important;border-color:var(--ui-accent-hover)!important;color:#fff!important}
body.brand-page.account-page #dashboard .ui-btn-primary:disabled{color:#fff!important}
body.brand-page.account-page #dashboard .ui-btn-primary[aria-disabled=true]:hover{background:var(--ui-accent)!important;border-color:var(--ui-accent)!important;color:#fff!important}
body.brand-page.account-page #dashboard .ui-btn-ghost{border-color:transparent!important;background:transparent!important;color:var(--ui-text-2)!important}
body.brand-page.account-page #dashboard .ui-btn-ghost:hover:not(:disabled){background:var(--ui-hover)!important;border-color:transparent!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-btn-ghost:disabled{color:var(--ui-text-2)!important}
body.brand-page.account-page #dashboard .ui-btn-ghost[aria-disabled=true]:hover{background:transparent!important;border-color:transparent!important;color:var(--ui-text-2)!important}
body.brand-page.account-page #dashboard .ui-btn-danger{background:var(--ui-danger)!important;border-color:var(--ui-danger)!important;color:#fff!important;font-weight:600!important}
body.brand-page.account-page #dashboard .ui-btn-danger:hover:not(:disabled){background:var(--ui-danger-text)!important;border-color:var(--ui-danger-text)!important;color:#fff!important}
body.brand-page.account-page #dashboard .ui-btn-danger:disabled{color:#fff!important}
body.brand-page.account-page #dashboard .ui-btn-danger-ghost{border-color:transparent!important;background:transparent!important;color:var(--ui-danger-text)!important;font-weight:500!important}
body.brand-page.account-page #dashboard .ui-btn-danger-ghost:hover:not(:disabled){background:var(--ui-danger-soft)!important;border-color:transparent!important;color:var(--ui-danger-text)!important}
body.brand-page.account-page #dashboard .ui-btn-danger-ghost:disabled{color:var(--ui-danger-text)!important}
body.brand-page.account-page #dashboard .ui-btn-sm{min-height:28px;padding:0 10px;font-size:13px!important}
body.brand-page.account-page #dashboard .ui-btn-sm .ui-ico{width:14px;height:14px}
body.brand-page.account-page #dashboard .ui-btn[aria-busy=true]{cursor:progress}
body.brand-page.account-page #dashboard .ui-btn[aria-busy=true] .ui-ico{animation:ui-spin .8s linear infinite}
body.brand-page.account-page #dashboard .ui-btn[aria-busy=true]:not(:has(.ui-ico))::before{content:"";flex:none;box-sizing:border-box;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:ui-spin .8s linear infinite}
body.brand-page.account-page #dashboard .ui-icon-btn{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;margin:0;padding:0;border:0!important;border-radius:6px!important;background:transparent!important;color:var(--ui-muted)!important;cursor:pointer;box-shadow:none!important;text-decoration:none!important}
body.brand-page.account-page #dashboard .ui-icon-btn:hover:not(:disabled){background:var(--ui-hover)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-icon-btn:disabled{opacity:.5;cursor:not-allowed}
body.brand-page.account-page #dashboard .ui-icon-btn .ui-ico{width:18px;height:18px}
body.brand-page.account-page #dashboard .ui-icon-btn.is-sm{width:28px;height:28px}
body.brand-page.account-page #dashboard .ui-icon-btn.is-sm .ui-ico{width:16px;height:16px}
@keyframes ui-spin{to{transform:rotate(360deg)}}

/* 4.7 Links */
body.brand-page.account-page #dashboard .ui-link-btn{display:inline-flex;align-items:center;gap:6px;margin:0;padding:0;border:0!important;background:transparent!important;color:var(--ui-accent)!important;font:600 14px/1.3 var(--ui-font)!important;text-decoration:none!important;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-link-btn:hover{color:var(--ui-accent-hover)!important;text-decoration:underline!important;text-underline-offset:3px}
body.brand-page.account-page #dashboard .ui-link-btn .ui-ico{width:14px;height:14px}
body.brand-page.account-page #dashboard .ui-link{color:var(--ui-accent)!important;font-weight:500;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:2px}
body.brand-page.account-page #dashboard .ui-link:hover{color:var(--ui-accent-hover)!important;text-decoration-thickness:2px!important}
body.brand-page.account-page #dashboard .ui-link-inline{display:inline;margin:0;padding:0;border:0!important;background:none!important;color:var(--ui-accent)!important;font:600 13px/1.4 var(--ui-font)!important;text-decoration:underline!important;text-underline-offset:2px;cursor:pointer;box-shadow:none!important}

/* 4.8 Fields and forms (= work.css:34-64 + stage-p2 .w-check-row) */
body.brand-page.account-page #dashboard .ui-field{display:grid;gap:6px;align-content:start;min-width:0;margin:0;color:var(--ui-text);font:400 14px/1.45 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-fieldset{display:grid;gap:8px;min-width:0;margin:0;padding:0;border:0!important}
body.brand-page.account-page #dashboard .ui-fieldset>legend{margin:0 0 8px;padding:0;color:var(--ui-ink);font:600 13px/1.35 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-label{color:var(--ui-ink);font:600 13px/1.35 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-label-sm{color:var(--ui-muted);font:500 12px/1.35 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-opt{color:var(--ui-faint);font-weight:400}
body.brand-page.account-page #dashboard .ui-hint{margin:0;color:var(--ui-muted);font-size:12px;line-height:1.45}
body.brand-page.account-page #dashboard .ui-input{display:block;width:100%;min-width:0;min-height:36px;margin:0;padding:7px 10px;border:1px solid var(--ui-line-strong)!important;border-radius:6px!important;background-color:#fff!important;color:var(--ui-ink)!important;font:400 14px/1.4 var(--ui-font)!important;box-shadow:none!important;transition:border-color .15s}
body.brand-page.account-page #dashboard .ui-input:hover:not(:disabled){border-color:var(--ui-field-hover)!important}
body.brand-page.account-page #dashboard .ui-input:focus-visible{outline:2px solid var(--ui-accent)!important;outline-offset:0!important;border-color:var(--ui-accent)!important;background-color:#fff!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard :is(input,textarea).ui-input::placeholder{color:var(--ui-faint);opacity:1}
body.brand-page.account-page #dashboard textarea.ui-input{min-height:84px;resize:vertical}
body.brand-page.account-page #dashboard select.ui-input{-webkit-appearance:none;appearance:none;padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 10px center!important;background-size:14px!important;cursor:pointer}
body.brand-page.account-page #dashboard select.ui-input:is([multiple],[size]:not([size="1"])){padding-right:10px;background-image:none!important}
body.brand-page.account-page #dashboard input.ui-input[type=search]{-webkit-appearance:none;appearance:none}
body.brand-page.account-page #dashboard .ui-input:disabled{background-color:var(--ui-subtle)!important;color:var(--ui-faint)!important;cursor:not-allowed}
body.brand-page.account-page #dashboard .ui-input[readonly]{background-color:var(--ui-subtle)!important}
body.brand-page.account-page #dashboard .ui-input[aria-invalid=true]{border-color:var(--ui-danger-dot)!important}
body.brand-page.account-page #dashboard .ui-input-sm{min-height:28px;padding-top:3px;padding-bottom:3px;font-size:13px!important}
body.brand-page.account-page #dashboard .ui-search{position:relative;display:block;min-width:0}
body.brand-page.account-page #dashboard .ui-search .ui-ico{position:absolute;top:50%;left:10px;transform:translateY(-50%);color:var(--ui-faint);pointer-events:none}
body.brand-page.account-page #dashboard .ui-search .ui-input{padding-left:32px}
body.brand-page.account-page #dashboard .ui-search .ui-input::-webkit-search-cancel-button{cursor:pointer}
body.brand-page.account-page #dashboard .ui-pair{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:12px;min-width:0}
body.brand-page.account-page #dashboard .ui-pair.is-even{grid-template-columns:repeat(2,minmax(0,1fr))}
body.brand-page.account-page #dashboard .ui-form{display:grid;gap:16px;min-width:0;margin:0}
body.brand-page.account-page #dashboard .ui-form-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
body.brand-page.account-page #dashboard .ui-form-actions>.ui-hint{margin-right:auto}
body.brand-page.account-page #dashboard .ui-form-actions.is-sticky{position:sticky;bottom:0;z-index:5;padding:12px 0;background:#fff;box-shadow:0 -1px 0 var(--ui-line)}
body.brand-page.account-page #dashboard .ui-form-error{margin:0;padding:8px 10px;border:1px solid var(--ui-danger-line)!important;border-radius:6px!important;background:var(--ui-danger-soft)!important;color:var(--ui-danger-text)!important;font-size:13px;line-height:1.45}
body.brand-page.account-page #dashboard .ui-form-error:empty{display:none}
body.brand-page.account-page #dashboard .ui-field-foot{display:flex;justify-content:space-between;gap:12px}
body.brand-page.account-page #dashboard .ui-counter{flex:none;color:var(--ui-faint);font-size:12px;font-variant-numeric:tabular-nums}
body.brand-page.account-page #dashboard .ui-check{flex:none;width:16px;height:16px;margin:0;accent-color:var(--ui-accent);cursor:pointer}
body.brand-page.account-page #dashboard .ui-check-inline{display:inline-flex;align-items:flex-start;gap:8px;margin:0;color:var(--ui-text);font:400 14px/20px var(--ui-font);cursor:pointer}
body.brand-page.account-page #dashboard .ui-check-inline>input{flex:none;margin-top:2px}
body.brand-page.account-page #dashboard .ui-check-row{display:flex;align-items:flex-start;gap:10px;margin:0;padding:10px 12px;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;color:var(--ui-ink)!important;font:400 13px/1.45 var(--ui-font)!important;cursor:pointer}
body.brand-page.account-page #dashboard .ui-check-row>input{flex:none;width:16px;height:16px;margin:1px 0 0;accent-color:var(--ui-accent);cursor:pointer}
body.brand-page.account-page #dashboard .ui-check-row:has(input:checked){border-color:var(--ui-accent)!important}
body.brand-page.account-page #dashboard .ui-check-row[data-tone=warn]{border-color:var(--ui-warning-line)!important;background:var(--ui-warning-soft)!important}
body.brand-page.account-page #dashboard .ui-radios{display:grid;gap:6px}
body.brand-page.account-page #dashboard .ui-radio{display:flex;align-items:center;gap:10px;min-height:40px;margin:0;padding:8px 12px;border:1px solid var(--ui-line);border-radius:8px;color:var(--ui-ink);font:400 14px/1.4 var(--ui-font);cursor:pointer}
body.brand-page.account-page #dashboard .ui-radio:hover{border-color:var(--ui-line-strong);background:var(--ui-subtle)}
body.brand-page.account-page #dashboard .ui-radio:has(input:checked){border-color:var(--ui-accent);background:var(--ui-accent-soft)}
body.brand-page.account-page #dashboard .ui-radio input{flex:none;width:16px;height:16px;margin:0;accent-color:var(--ui-accent);cursor:pointer}
body.brand-page.account-page #dashboard .ui-chips{display:flex;flex-wrap:wrap;gap:6px}
body.brand-page.account-page #dashboard .ui-chip{display:inline-flex;align-items:center;min-height:28px;margin:0;padding:5px 10px;border:1px solid var(--ui-line-strong)!important;border-radius:999px!important;background:#fff!important;color:var(--ui-text)!important;font:500 13px/1.2 var(--ui-font)!important;text-align:left;text-decoration:none!important;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-chip:hover:not(:disabled){border-color:var(--ui-field-hover)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-chip[aria-pressed=true]{border-color:var(--ui-accent)!important;background:var(--ui-accent-soft)!important;color:var(--ui-accent)!important;font-weight:600!important}
body.brand-page.account-page #dashboard .ui-chip:disabled{opacity:.45;cursor:not-allowed}

/* 4.1 Page header (= .w-head, work.css:67-74) */
body.brand-page.account-page #dashboard .ui-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:12px 16px;margin:0 0 16px}
body.brand-page.account-page #dashboard .ui-head:has(+.ui-tabs,+*>.ui-tabs:first-child,+[hidden]+.ui-tabs,+[hidden]+*>.ui-tabs:first-child){margin-bottom:12px}
body.brand-page.account-page #dashboard .ui-head-text{flex:1 1 auto;min-width:0}
body.brand-page.account-page #dashboard .ui-head-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
body.brand-page.account-page #dashboard .ui-title{margin:0;color:var(--ui-ink)!important;font:600 20px/28px var(--ui-font)!important;letter-spacing:-.01em;text-transform:none;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;margin:4px 0 0;color:var(--ui-muted);font-size:13px;line-height:1.5}
body.brand-page.account-page #dashboard .ui-summary time{color:inherit}
body.brand-page.account-page #dashboard .ui-sum-alert{color:var(--ui-danger-text);font-weight:500}
body.brand-page.account-page #dashboard .ui-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0;margin:0 0 6px;color:var(--ui-muted);font:500 12px/1.3 var(--ui-font)}
/* The case header's facts (account.js caseHead): each group wraps whole with the separator before it; on a phone the institution
   takes a line of its own and the separators go, so a line never ends on a „·” (A7 QA at 390). */
body.brand-page.account-page #dashboard .case-head-part{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;min-width:0}
body.brand-page.account-page #dashboard .case-head-kicker .case-head-part{align-items:center}
/* A case page on a phone (A7.3; body.case-open, account.js showPanel): the account's identity row and „Parcurge panoul” leave the
   first screen (both are on the lists the back link leads to) and the title keeps two lines, so the step's box starts near the top. */
@media(max-width:600px){
  body.brand-page.account-page #dashboard .case-head-part>.ui-sep{display:none}
  body.brand-page.account-page #dashboard .case-head-kicker .case-head-part{flex-basis:100%}
  body.brand-page.account-page #dashboard .case-head-summary{gap:4px 10px}
  body.brand-page.account-page.account-top.case-open #accountTopbar .account-identity,body.brand-page.account-page.account-top.case-open #dashboard .account-sidebar{display:none!important}
  body.brand-page.account-page.case-open #dashboard .case-detail-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
}

/* 4.2 Intro and back line */
body.brand-page.account-page #dashboard .ui-intro{margin:-4px 0 16px;max-width:72ch;color:var(--ui-muted);font-size:14px;line-height:1.55}
body.brand-page.account-page #dashboard .ui-backline{margin:0 0 8px}
body.brand-page.account-page #dashboard .ui-backline>.ui-btn{margin-left:-10px}

/* 4.3 Tabs and the "Mai multe" menu (= stage-p2 .w-views-bar, .w-views, .w-view, .w-view-count, .w-more, .w-menu). The
   strip never clips: IGovUI.tabs moves the tabs that do not fit into "Mai multe" (horizontal scroll is only a fallback). */
body.brand-page.account-page #dashboard .ui-tabs{display:flex;align-items:stretch;gap:2px;min-width:0;margin:0 0 16px;box-shadow:inset 0 -1px 0 var(--ui-line)}
/* A strip brought into view by a script (a case opened on its Monitorizare tab after "Începe configurarea") clears the sticky bars. */
body.brand-page.account-page #dashboard .ui-tabs{scroll-margin-top:calc(var(--ui-sticky-top) + 16px)}
body.brand-page.account-page #dashboard .ui-tabs-list{display:flex;flex:1 1 auto;gap:2px;min-width:0;margin:0;padding:0 2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--ui-line-strong) transparent}
body.brand-page.account-page #dashboard .ui-tab{display:inline-flex;align-items:center;gap:8px;flex:none;min-height:40px;margin:0;padding:2px 12px 0;border:0!important;border-bottom:2px solid transparent!important;border-radius:6px 6px 0 0!important;background:transparent!important;color:var(--ui-muted)!important;font:500 14px/1.2 var(--ui-font)!important;text-decoration:none!important;text-transform:none;letter-spacing:0;white-space:nowrap;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-tab:hover{background:var(--ui-subtle)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-tab[aria-selected=true]{border-bottom-color:var(--ui-accent)!important;color:var(--ui-ink)!important;font-weight:600!important}
body.brand-page.account-page #dashboard .ui-tab:focus-visible{outline-offset:-2px!important}
body.brand-page.account-page #dashboard .ui-tab-label{min-width:0}
body.brand-page.account-page #dashboard .ui-tabs-more{position:relative;display:flex;flex:none}
body.brand-page.account-page #dashboard .ui-tabs-more-btn{gap:6px}
body.brand-page.account-page #dashboard .ui-tabs-more-ico{width:14px;height:14px;transition:transform .15s}
body.brand-page.account-page #dashboard .ui-tabs-more-btn[aria-expanded=true]{background:var(--ui-subtle)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-tabs-more-btn[aria-expanded=true] .ui-tabs-more-ico{transform:rotate(180deg)}
body.brand-page.account-page #dashboard .ui-tabs-more-btn[data-alert=true]::after{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--ui-danger-dot)}
body.brand-page.account-page #dashboard .ui-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;display:grid;gap:2px;min-width:220px;margin:0;padding:4px;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:var(--ui-shadow-menu)!important}
body.brand-page.account-page #dashboard .ui-menu-item{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:36px;margin:0;padding:0 10px;border:0!important;border-radius:6px!important;background:transparent!important;color:var(--ui-text)!important;font:500 14px/1.2 var(--ui-font)!important;text-align:left;text-decoration:none!important;white-space:nowrap;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-menu-item:is(:hover,:focus-visible){background:var(--ui-hover)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-menu-item:focus-visible{outline-offset:-2px!important}

/* 4.4 Toolbar and segmented control (= .w-seg, work.css:75-79, .w-seg-wide 366-373) */
body.brand-page.account-page #dashboard .ui-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:0 0 12px}
body.brand-page.account-page #dashboard .ui-seg{display:inline-flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--ui-line);border-radius:8px;background:var(--ui-subtle)}
body.brand-page.account-page #dashboard .ui-seg-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:28px;margin:0;padding:0 10px;border:0!important;border-radius:6px!important;background:transparent!important;color:var(--ui-muted)!important;font:500 13px/1.2 var(--ui-font)!important;text-decoration:none!important;white-space:nowrap;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-seg-btn:hover:not(:disabled){color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-seg-btn[aria-pressed=true]{background:#fff!important;color:var(--ui-ink)!important;font-weight:600!important;box-shadow:0 0 0 1px var(--ui-line)!important}
body.brand-page.account-page #dashboard .ui-seg-btn:disabled{color:var(--ui-disabled)!important;cursor:not-allowed}
body.brand-page.account-page #dashboard .ui-seg-btn[aria-pressed=true]:disabled{color:var(--ui-ink)!important;cursor:default}
body.brand-page.account-page #dashboard .ui-seg.is-wide{display:flex;flex-wrap:wrap;width:100%}
body.brand-page.account-page #dashboard .ui-seg.is-wide .ui-seg-btn{flex:1 1 auto}
body.brand-page.account-page #dashboard .ui-seg-btn:is([data-status],[data-set-status])[aria-pressed=true]::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--ui-t-fg,var(--ui-accent))}

/* 4.5 Filters (= .w-filters, work.css:92-125). The shell places the panel (right column, or above the list); its surface
   and contents are styled here. Container tiers are in section 9. */
body.brand-page.account-page #dashboard .ui-filters{container:uifilters/inline-size;margin:0 0 16px;padding:16px!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:var(--ui-subtle)!important;box-shadow:none!important;color:var(--ui-text);font:400 14px/1.45 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-filters-in{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin:0;padding:0;border:0}
body.brand-page.account-page #dashboard .ui-facets{display:grid;gap:2px}
body.brand-page.account-page #dashboard .ui-facet{display:flex;align-items:center;gap:8px;width:100%;min-height:32px;margin:0;padding:0 8px;border:0!important;border-radius:6px!important;background:transparent!important;color:var(--ui-text)!important;font:500 13px/1.2 var(--ui-font)!important;text-align:left;text-decoration:none!important;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-facet .ui-ico{color:var(--ui-faint)}
body.brand-page.account-page #dashboard .ui-facet:hover{background:#fff!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-facet[aria-pressed=true]{background:#fff!important;color:var(--ui-accent)!important;font-weight:600!important;box-shadow:0 0 0 1px var(--ui-line)!important}
body.brand-page.account-page #dashboard .ui-facet[aria-pressed=true] .ui-ico{color:var(--ui-accent)}
body.brand-page.account-page #dashboard .ui-facet-label{flex:1;min-width:0}
body.brand-page.account-page #dashboard .ui-facet-count{color:var(--ui-muted);font-size:12px;font-weight:500;font-variant-numeric:tabular-nums}
body.brand-page.account-page #dashboard .ui-reset{justify-self:start;margin-left:-8px}

/* 4.16 Notes, alerts, next-step box (= .w-warning work.css:127-128, stage-p2 .w-callout, .w-offer work.css:354-360). An
   alert flows as one block of text; its leading icon sits in the left padding, so text, <time> and links never split. */
body.brand-page.account-page #dashboard .ui-note{margin:0;color:var(--ui-muted);font-size:13px;line-height:1.5}
body.brand-page.account-page #dashboard .ui-note:empty{display:none}
body.brand-page.account-page #dashboard .ui-footnote{margin:16px 0 0;color:var(--ui-muted);font-size:13px;line-height:1.5}
body.brand-page.account-page #dashboard .ui-alert{position:relative;display:block;margin:0 0 12px;padding:10px 12px;border:1px solid var(--ui-a-line,var(--ui-line))!important;border-radius:8px!important;background:var(--ui-a-bg,var(--ui-subtle))!important;color:var(--ui-a-fg,var(--ui-text))!important;font:400 13px/1.45 var(--ui-font)!important;box-shadow:none!important;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-alert:has(>.ui-ico:first-child){padding-left:36px}
body.brand-page.account-page #dashboard .ui-alert>.ui-ico:first-child{position:absolute;top:11px;left:12px;color:var(--ui-a-ico,currentColor)}
body.brand-page.account-page #dashboard .ui-alert[data-tone=warn]{--ui-a-line:var(--ui-warning-line);--ui-a-bg:var(--ui-warning-soft);--ui-a-fg:var(--ui-warning-text);--ui-a-ico:var(--ui-warning-icon)}
body.brand-page.account-page #dashboard .ui-alert[data-tone=bad]{--ui-a-line:var(--ui-danger-line);--ui-a-bg:var(--ui-danger-soft);--ui-a-fg:var(--ui-danger-text);--ui-a-ico:var(--ui-danger)}
body.brand-page.account-page #dashboard .ui-alert[data-tone=info]{--ui-a-line:var(--ui-accent-line);--ui-a-bg:var(--ui-accent-soft);--ui-a-fg:var(--ui-ink);--ui-a-ico:var(--ui-accent)}
body.brand-page.account-page #dashboard .ui-alert[data-tone=ok]{--ui-a-line:var(--ui-success-line);--ui-a-bg:var(--ui-success-soft);--ui-a-fg:var(--ui-success);--ui-a-ico:var(--ui-success)}
body.brand-page.account-page #dashboard .ui-alert-title{font-weight:600}
body.brand-page.account-page #dashboard .ui-alert .ui-actions{margin-top:8px}
body.brand-page.account-page #dashboard .ui-offer{display:grid;gap:6px;min-width:0;margin:0 0 16px;padding:12px 14px;border:1px solid var(--ui-accent-line)!important;border-radius:8px!important;background:var(--ui-accent-soft)!important;color:var(--ui-ink);box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-offer.is-mine{border-color:var(--ui-warning-line)!important;background:var(--ui-warning-soft)!important}
body.brand-page.account-page #dashboard .ui-offer-title{margin:0;color:var(--ui-ink);font-size:14px;line-height:1.45}
body.brand-page.account-page #dashboard .ui-offer-meta{margin:0;color:var(--ui-muted);font-size:12px}
body.brand-page.account-page #dashboard .ui-offer-meta:empty{display:none}
body.brand-page.account-page #dashboard .ui-offer .ui-actions{margin:4px 0 0}
/* Inside a grid that spaces its children with gap (cards, row bodies, disclosure and dialog bodies, forms, inset sections), an
   alert, a next-step box or a stacked disclosure adds no margin of its own: the gap is the only space. (1,5,1). */
body.brand-page.account-page #dashboard :is(.ui-card,.ui-row-body,.ui-details-body,.ui-dialog-body,.ui-form,.ui-section.is-inset)>:is(.ui-alert,.ui-offer,.ui-details){margin:0}

/* Severity (work.css:151-153): rows, table rows and cards draw --ui-sev as a 3px inset bar. */
body.brand-page.account-page #dashboard :is(.ui-row,.ui-row-details,.ui-tr,.ui-card,.ui-sev,.ui-pill-dot)[data-severity=critical]{--ui-sev:var(--ui-danger)}
body.brand-page.account-page #dashboard :is(.ui-row,.ui-row-details,.ui-tr,.ui-card,.ui-sev,.ui-pill-dot)[data-severity=warning]{--ui-sev:var(--ui-warning)}
body.brand-page.account-page #dashboard :is(.ui-row,.ui-row-details,.ui-tr,.ui-card,.ui-sev,.ui-pill-dot)[data-severity=info]{--ui-sev:var(--ui-info)}

/* 4.9 Lists and rows */
body.brand-page.account-page #dashboard .ui-list{container:uilist/inline-size;min-width:0;margin:0;padding:0;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important;list-style:none}
body.brand-page.account-page #dashboard .ui-row{display:grid;grid-template-areas:"lead main side";grid-template-columns:auto minmax(0,1fr) auto;column-gap:0;row-gap:8px;align-items:start;min-width:0;margin:0;padding:12px 16px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--ui-text);font:400 14px/1.45 var(--ui-font);overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-list>*+*{border-top:1px solid var(--ui-line)!important}
body.brand-page.account-page #dashboard .ui-list>:first-child,body.brand-page.account-page #dashboard .ui-list>:first-child>summary{border-top-left-radius:7px!important;border-top-right-radius:7px!important}
body.brand-page.account-page #dashboard .ui-list>:last-child,body.brand-page.account-page #dashboard .ui-list>:last-child:not([open])>summary,body.brand-page.account-page #dashboard .ui-list>:last-child>.ui-row-body{border-bottom-left-radius:7px!important;border-bottom-right-radius:7px!important}
body.brand-page.account-page #dashboard .ui-row-lead{grid-area:lead;margin-right:12px}
body.brand-page.account-page #dashboard .ui-row-main{grid-area:main;display:grid;gap:2px;min-width:0}
body.brand-page.account-page #dashboard .ui-row-side{grid-area:side;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;min-width:0;margin-left:12px}
body.brand-page.account-page #dashboard .ui-row-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;margin:0;color:var(--ui-muted);font:500 12px/1.3 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-row-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:0;color:var(--ui-ink)!important;font:600 14px/1.4 var(--ui-font)!important;letter-spacing:0}
body.brand-page.account-page #dashboard .ui-row-sub{margin:0;color:var(--ui-muted);font-size:13px;line-height:1.4}
body.brand-page.account-page #dashboard .ui-row-text{margin:0;color:var(--ui-text);font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
/* An item title inside a row, a table cell or a card is a link or a button (= .w-title, work.css:165-166). The page title is
   h2.ui-title (4.1). */
body.brand-page.account-page #dashboard :is(a,button).ui-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;max-width:100%;margin:0;padding:0;border:0!important;border-radius:3px!important;background:transparent!important;color:var(--ui-ink)!important;font:600 14px/1.4 var(--ui-font)!important;letter-spacing:0;text-align:left;text-decoration:none!important;overflow-wrap:anywhere;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard :is(a,button).ui-title:hover,body.brand-page.account-page #dashboard [aria-current=true] :is(a,button).ui-title{color:var(--ui-accent)!important}
body.brand-page.account-page #dashboard .ui-row-title :is(a,button).ui-title{display:inline}
body.brand-page.account-page #dashboard .ui-row.is-link{cursor:pointer}
body.brand-page.account-page #dashboard .ui-row.is-link:hover{background:var(--ui-subtle)!important}
body.brand-page.account-page #dashboard .ui-row[data-severity],body.brand-page.account-page #dashboard .ui-row-details[data-severity]>summary.ui-row{box-shadow:inset 3px 0 0 var(--ui-sev,transparent)!important}
body.brand-page.account-page #dashboard .ui-row.is-unread{box-shadow:inset 3px 0 0 var(--ui-accent)!important}
body.brand-page.account-page #dashboard .ui-row.is-unread .ui-row-title{font-weight:600!important}
body.brand-page.account-page #dashboard .ui-list.has-read-state .ui-row:not(.is-unread) .ui-row-title{color:var(--ui-text)!important;font-weight:500!important}
body.brand-page.account-page #dashboard .ui-row[aria-current=true]{background:var(--ui-accent-soft)!important}
/* A row that opens: details.ui-row-details > summary.ui-row + .ui-row-body. The chevron ends .ui-row-side. */
body.brand-page.account-page #dashboard .ui-row-details{min-width:0;margin:0;padding:0;border:0;background:transparent}
body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row{list-style:none;cursor:pointer}
body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row::-webkit-details-marker{display:none}
body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row:hover{background:var(--ui-subtle)!important}
body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row:focus-visible{outline-offset:-2px!important}
body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row .ui-row-side::after,body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row:not(:has(>.ui-row-side))::after{content:"";flex:none;box-sizing:border-box;width:7px;height:7px;margin:0 4px 3px 4px;border:solid var(--ui-muted);border-width:0 1.5px 1.5px 0;transform:rotate(45deg);transition:transform .15s}
body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row:not(:has(>.ui-row-side))::after{grid-area:side;align-self:center;margin-left:12px}
body.brand-page.account-page #dashboard .ui-row-details[open]>summary.ui-row .ui-row-side::after,body.brand-page.account-page #dashboard .ui-row-details[open]>summary.ui-row:not(:has(>.ui-row-side))::after{margin-top:3px;margin-bottom:0;transform:rotate(-135deg)}
body.brand-page.account-page #dashboard .ui-row-body{display:grid;gap:16px;min-width:0;padding:16px;border-top:1px solid var(--ui-line);background:var(--ui-subtle);color:var(--ui-text)}

/* 4.10 Cards, choice cards, grid */
body.brand-page.account-page #dashboard .ui-card{display:grid;gap:8px;min-width:0;margin:0;padding:16px;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;color:var(--ui-text);box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-card:not(.is-compact,.ui-choice)+:is(.ui-card,.account-panel):not(.is-compact,.ui-choice){margin-top:16px!important}
body.brand-page.account-page #dashboard .ui-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}
body.brand-page.account-page #dashboard .ui-card-title{margin:0;color:var(--ui-ink)!important;font:600 15px/1.4 var(--ui-font)!important;letter-spacing:0;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-card-sub{margin:0;color:var(--ui-muted);font-size:13px;line-height:1.45}
body.brand-page.account-page #dashboard .ui-card-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:0;color:var(--ui-text);font-size:13px;line-height:1.45;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-card-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 8px;min-width:0;margin:0}
body.brand-page.account-page #dashboard .ui-card-top{display:flex;align-items:center;gap:8px;min-width:0;margin:0}
/* Compact card (= .w-card, work.css:271-283): board tickets. */
body.brand-page.account-page #dashboard .ui-card.is-compact{gap:6px;padding:10px 12px 10px 14px;box-shadow:inset 3px 0 0 var(--ui-sev,var(--ui-line-strong))!important;transition:border-color .15s}
body.brand-page.account-page #dashboard .ui-card.is-compact:hover{border-color:var(--ui-line-hover)!important}
body.brand-page.account-page #dashboard .ui-card.is-compact[aria-current=true]{border-color:var(--ui-accent)!important;background:#fbfcff!important}
body.brand-page.account-page #dashboard .ui-card[draggable=true]{cursor:grab}
body.brand-page.account-page #dashboard .ui-card.is-dragging{opacity:.45;cursor:grabbing}
body.brand-page.account-page #dashboard .ui-card.is-compact .ui-card-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:13px!important}
body.brand-page.account-page #dashboard .ui-card.is-compact .ui-card-title :is(a,button).ui-title{display:inline;font-size:13px!important}
body.brand-page.account-page #dashboard .ui-card.is-compact .ui-card-sub{overflow:hidden;min-width:0;font-size:12px;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-card.is-compact .ui-card-foot{font-size:12px}
body.brand-page.account-page #dashboard .ui-card.is-compact .ui-card-foot :is(.ui-due,.ui-time){font-size:12px}
/* Choice card: a selectable card button (flow-start methods). */
body.brand-page.account-page #dashboard button.ui-card.ui-choice{width:100%;color:var(--ui-text)!important;font:inherit;text-align:left;text-decoration:none!important;cursor:pointer;transition:border-color .15s,background-color .15s}
body.brand-page.account-page #dashboard .ui-card.ui-choice:hover{border-color:var(--ui-line-hover)!important}
body.brand-page.account-page #dashboard .ui-card.ui-choice:is([aria-pressed=true],:focus-visible){border-color:var(--ui-accent)!important;background:var(--ui-accent-soft)!important}
body.brand-page.account-page #dashboard .ui-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:12px;min-width:0;margin:0}

/* 4.10 Board (= work.css:261-286). Columns keep 184px and scroll inside the board; at 600px or narrower they are 86% wide
   with mandatory snap (section 9). */
body.brand-page.account-page #dashboard .ui-board{display:grid;grid-template-columns:repeat(5,minmax(184px,1fr));gap:12px;min-width:0;margin:0;padding:0 0 8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity}
body.brand-page.account-page #dashboard .ui-col{display:flex;flex-direction:column;min-width:0;min-height:260px;margin:0;padding:0!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:var(--ui-subtle)!important;box-shadow:none!important;scroll-snap-align:start;transition:border-color .15s,background-color .15s,opacity .15s}
body.brand-page.account-page #dashboard .ui-col-head{display:flex;align-items:center;gap:8px;margin:0;padding:10px 12px;border-bottom:1px solid var(--ui-line)}
body.brand-page.account-page #dashboard .ui-col-title{display:block;flex:1;min-width:0;margin:0;color:var(--ui-ink)!important;font:600 13px/1.3 var(--ui-font)!important;letter-spacing:0;text-transform:none}
body.brand-page.account-page #dashboard .ui-col-count{flex:none;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#fff;color:var(--ui-text-2);font:500 12px/20px var(--ui-font);text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 0 0 1px var(--ui-line)}
body.brand-page.account-page #dashboard .ui-col-body{display:grid;align-content:start;gap:8px;flex:1;min-width:0;padding:8px}
body.brand-page.account-page #dashboard .ui-col-empty{margin:0;padding:16px 8px;color:var(--ui-faint);font-size:13px;text-align:center}
body.brand-page.account-page #dashboard .ui-col[data-drop=ok]{border-style:dashed!important;border-color:var(--ui-drop)!important}
body.brand-page.account-page #dashboard .ui-col[data-drop=no]{opacity:.55}
body.brand-page.account-page #dashboard .ui-col.is-over{border-style:solid!important;border-color:var(--ui-accent)!important;background:var(--ui-accent-soft)!important;opacity:1}

/* 4.11 Table (= .w-table, work.css:133-256). Container tiers are in section 9. */
body.brand-page.account-page #dashboard .ui-table-wrap{container:uitable/inline-size;min-width:0;margin:0;border:1px solid var(--ui-line);border-radius:8px;background:#fff}
/* A wrap without a sticky header scrolls sideways rather than pushing the page wider (sticky headers need a visible overflow). */
body.brand-page.account-page #dashboard .ui-table-wrap:not(:has(.is-sticky)){overflow-x:auto}
body.brand-page.account-page #dashboard .ui-table{width:100%;margin:0;border:0!important;border-collapse:separate;border-spacing:0;table-layout:auto;color:var(--ui-text);font:400 14px/1.45 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-table.is-fixed{table-layout:fixed}
body.brand-page.account-page #dashboard .ui-table thead th{height:38px;padding:0 12px;border:0!important;border-bottom:1px solid var(--ui-line)!important;background:var(--ui-subtle)!important;color:var(--ui-text-2)!important;font:600 12px/1.2 var(--ui-font)!important;text-align:left;text-transform:none;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-table thead th:first-child{border-top-left-radius:7px}
body.brand-page.account-page #dashboard .ui-table thead th:last-child{border-top-right-radius:7px}
body.brand-page.account-page #dashboard .ui-table.is-sticky thead th{position:sticky;top:var(--ui-sticky-top);z-index:2}
body.brand-page.account-page #dashboard .ui-table td,body.brand-page.account-page #dashboard .ui-table tbody th{padding:10px 12px;border:0!important;border-bottom:1px solid var(--ui-line)!important;background:#fff;color:var(--ui-text);vertical-align:middle}
body.brand-page.account-page #dashboard .ui-table tbody th{background:#fff!important;color:var(--ui-text)!important;font:400 14px/1.45 var(--ui-font)!important;text-align:left;white-space:normal}
body.brand-page.account-page #dashboard .ui-table tbody tr:is(:last-child,:not([hidden]):not(:has(~tr:not([hidden]))))>:is(td,th){border-bottom:0!important}
body.brand-page.account-page #dashboard .ui-table tbody tr:is(:last-child,:not([hidden]):not(:has(~tr:not([hidden]))))>:is(td,th):first-child{border-bottom-left-radius:7px}
body.brand-page.account-page #dashboard .ui-table tbody tr:is(:last-child,:not([hidden]):not(:has(~tr:not([hidden]))))>:is(td,th):last-child{border-bottom-right-radius:7px}
body.brand-page.account-page #dashboard .ui-table caption{caption-side:top}
/* Columns */
body.brand-page.account-page #dashboard .ui-table .ui-col-check{width:40px;padding-right:0;text-align:center}
body.brand-page.account-page #dashboard .ui-table .ui-col-status{width:132px}
body.brand-page.account-page #dashboard .ui-table .ui-col-owner{width:140px}
body.brand-page.account-page #dashboard .ui-table .ui-col-due{width:108px}
body.brand-page.account-page #dashboard .ui-table .ui-col-next{width:22%}
body.brand-page.account-page #dashboard .ui-table .ui-col-time{width:96px;color:var(--ui-muted);font-size:13px;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-table td.ui-col-time>*{display:block;max-width:72px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-table .ui-col-num{text-align:right;font-variant-numeric:tabular-nums}
body.brand-page.account-page #dashboard .ui-table .ui-col-action{width:104px;text-align:right;white-space:nowrap}
body.brand-page.account-page #dashboard .ui-table thead .ui-col-num,body.brand-page.account-page #dashboard .ui-table thead .ui-col-action{text-align:right}
/* Rows */
body.brand-page.account-page #dashboard .ui-tr{scroll-margin-top:calc(var(--ui-sticky-top) + 48px);scroll-margin-bottom:96px}
body.brand-page.account-page #dashboard .ui-tr.is-link{cursor:pointer}
body.brand-page.account-page #dashboard .ui-tr:hover>td{background:var(--ui-subtle)}
body.brand-page.account-page #dashboard .ui-tr[data-severity]>td:first-child{box-shadow:inset 3px 0 0 var(--ui-sev,transparent)}
body.brand-page.account-page #dashboard .ui-tr[data-selected]>td{background:var(--ui-selected)}
body.brand-page.account-page #dashboard .ui-tr[aria-current=true]>td{background:var(--ui-accent-soft)}
body.brand-page.account-page #dashboard .ui-tr.is-expanded>td{background:var(--ui-subtle);border-bottom-color:transparent!important}
body.brand-page.account-page #dashboard .ui-tr.is-skeleton{cursor:default}
body.brand-page.account-page #dashboard .ui-tr.is-skeleton>td{background:#fff}
body.brand-page.account-page #dashboard .ui-table-detail>td{padding:16px;background:var(--ui-subtle)}
/* Item cell */
body.brand-page.account-page #dashboard .ui-item{display:flex;align-items:flex-start;gap:10px;min-width:0}
/* With table-layout:auto a nowrap subtitle would widen the column (no ellipsis, horizontal overflow); inline-size containment
   lets the item take the width the other columns leave, as Lucru's fixed layout does. */
body.brand-page.account-page #dashboard .ui-table .ui-item{contain:inline-size}
body.brand-page.account-page #dashboard .ui-item-text{display:grid;gap:2px;min-width:0}
body.brand-page.account-page #dashboard .ui-sub{display:block;overflow:hidden;min-width:0;color:var(--ui-muted);font-size:13px;line-height:1.4;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-item-next{display:flex;align-items:center;gap:4px;min-width:0;color:var(--ui-text);font-size:13px;line-height:1.4}
body.brand-page.account-page #dashboard .ui-item-next.is-derived{color:var(--ui-muted)}
body.brand-page.account-page #dashboard .ui-item-next.is-mine{color:var(--ui-accent);font-weight:500}
body.brand-page.account-page #dashboard .ui-item-next .ui-ico{width:12px;height:12px;color:var(--ui-faint)}
body.brand-page.account-page #dashboard .ui-item-next.is-mine .ui-ico{color:currentColor}
body.brand-page.account-page #dashboard .ui-item-next-text{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
/* An author's next step wraps on two lines (A7.3): their rows are the sentence, not a cut line. */
body.brand-page.account-page #dashboard .ui-item-next.is-wrap{align-items:flex-start}
body.brand-page.account-page #dashboard .ui-item-next.is-wrap .ui-ico{flex:none;margin-top:3px}
body.brand-page.account-page #dashboard .ui-item-next.is-wrap .ui-item-next-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal}
/* A table with its own "next step" column shows .ui-item-next only when that column goes (1079px and narrower). */
body.brand-page.account-page #dashboard .ui-table:has(.ui-col-next) .ui-item-next{display:none}
body.brand-page.account-page #dashboard .ui-next{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:var(--ui-text);font-size:13px;line-height:1.45}
body.brand-page.account-page #dashboard .ui-next.is-derived{color:var(--ui-muted)}
/* Row actions: "Deschide" waits for hover or focus; a real action (primary or .is-pinned) is always visible (Lucru, d7fdba2). */
body.brand-page.account-page #dashboard .ui-table.has-hover-actions .ui-col-action .ui-btn:not(.is-pinned):not(.ui-btn-primary){opacity:0;transition:opacity .12s}
body.brand-page.account-page #dashboard .ui-table.has-hover-actions tr:is(:hover,:focus-within) .ui-col-action .ui-btn:not(.is-pinned):not(.ui-btn-primary){opacity:1}
@media(hover:none){body.brand-page.account-page #dashboard .ui-table.has-hover-actions .ui-col-action .ui-btn:not(.is-pinned):not(.ui-btn-primary){opacity:1}}
/* Several actions in one row (Privire de ansamblu, P1-16: the row's action, then "Deschide cazul", "Vezi rezultatul"): one
   under the other, right-aligned, the row's own action on top; the column takes the width of the widest. Cards (639px and
   narrower) put them side by side. */
body.brand-page.account-page #dashboard .ui-table .ui-col-action>.ui-actions{flex-direction:column;flex-wrap:nowrap;align-items:flex-end;gap:6px}
/* Matrix (preferences): rows of categories, columns of channels. */
body.brand-page.account-page #dashboard .ui-table-matrix tbody th[scope=row]{font-weight:400!important}
body.brand-page.account-page #dashboard .ui-table-matrix .ui-col-check{width:96px;padding-right:12px;text-align:center}
body.brand-page.account-page #dashboard .ui-table-matrix .ui-sub{white-space:normal;overflow:visible;margin-top:2px}
body.brand-page.account-page #dashboard .ui-table-matrix .ui-check{display:inline-block;width:18px;height:18px;vertical-align:middle}
body.brand-page.account-page #dashboard .ui-title-sm{display:block;color:var(--ui-ink);font:600 14px/1.4 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-title-sm .ui-tag{margin-left:6px}

/* 4.12 Pills, tones, tags, counts, kind tiles, people, deadlines, times, severity (work.css:161-203, 437). A pill or a tag that
   is a grid item (a row's text column, an inset section) keeps its own width (justify-self:start) instead of stretching. */
body.brand-page.account-page #dashboard :is(.ui-pill,.ui-pill-dot,.ui-tag,.ui-seg-btn):is([data-tone=neutral],[data-status=new],[data-set-status=new]){--ui-t-fg:#475467;--ui-t-bg:#f2f4f7;--ui-t-line:#e3e8ef}
body.brand-page.account-page #dashboard :is(.ui-pill,.ui-pill-dot,.ui-tag,.ui-seg-btn):is([data-tone=info],[data-status=acknowledged],[data-set-status=acknowledged]){--ui-t-fg:#175cd3;--ui-t-bg:#eff8ff;--ui-t-line:#b2ddff}
body.brand-page.account-page #dashboard :is(.ui-pill,.ui-pill-dot,.ui-tag,.ui-seg-btn):is([data-tone=progress],[data-status=in_progress],[data-set-status=in_progress]){--ui-t-fg:#6941c6;--ui-t-bg:#f4f3ff;--ui-t-line:#e3e8ef}
body.brand-page.account-page #dashboard :is(.ui-pill,.ui-pill-dot,.ui-tag,.ui-seg-btn):is([data-tone=warn],[data-status=waiting],[data-set-status=waiting]){--ui-t-fg:#b54708;--ui-t-bg:#fffaeb;--ui-t-line:#fedf89}
body.brand-page.account-page #dashboard :is(.ui-pill,.ui-pill-dot,.ui-tag,.ui-seg-btn):is([data-tone=ok],[data-status=resolved],[data-set-status=resolved]){--ui-t-fg:#067647;--ui-t-bg:#ecfdf3;--ui-t-line:#abefc6}
body.brand-page.account-page #dashboard :is(.ui-pill,.ui-pill-dot,.ui-tag,.ui-seg-btn)[data-tone=bad]{--ui-t-fg:#b42318;--ui-t-bg:#fef3f2;--ui-t-line:#fecdca}
body.brand-page.account-page #dashboard .ui-pill{display:inline-flex;align-items:center;justify-self:start;gap:6px;max-width:100%;height:22px;margin:0;padding:0 9px 0 8px;border:0!important;border-radius:999px!important;background:var(--ui-t-bg,#f2f4f7)!important;color:var(--ui-t-fg,#475467)!important;font:500 12px/1 var(--ui-font)!important;letter-spacing:0;text-decoration:none!important;white-space:nowrap;vertical-align:middle;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-pill-text{min-width:0;overflow:hidden;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-pill-dot{display:inline-block;flex:none;width:6px;height:6px;border-radius:50%;background:currentColor}
body.brand-page.account-page #dashboard .ui-pill-dot:is([data-tone],[data-status]){color:var(--ui-t-fg,currentColor)}
body.brand-page.account-page #dashboard .ui-pill-dot[data-severity]{color:var(--ui-sev,var(--ui-faint))}
body.brand-page.account-page #dashboard .ui-pill-sub{font-weight:400;opacity:.85}
/* The waiting party (or any sub-line) sits under the pill, so a narrow column never cuts the status (Lucru .w-pill-on). */
body.brand-page.account-page #dashboard .ui-pill-on{display:block;margin-top:3px;color:var(--ui-muted);font-size:12px;line-height:1.3;white-space:normal}
body.brand-page.account-page #dashboard .ui-pill-stack{display:inline-grid;justify-items:start;justify-self:start;gap:3px;min-width:0;max-width:100%;vertical-align:middle}
body.brand-page.account-page #dashboard .ui-pill-stack>.ui-pill-on{margin-top:0}
body.brand-page.account-page #dashboard .ui-tag{display:inline-flex;align-items:center;gap:4px;align-self:center;justify-self:start;max-width:100%;margin:0;padding:0 6px;border:0!important;border-radius:4px!important;background:var(--ui-t-bg,var(--ui-hover))!important;color:var(--ui-t-fg,var(--ui-text-2))!important;font:500 11px/18px var(--ui-font)!important;letter-spacing:0;text-decoration:none!important;vertical-align:middle;overflow-wrap:anywhere;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-tag .ui-ico{width:12px;height:12px}
body.brand-page.account-page #dashboard a.ui-tag:hover{background:var(--ui-line)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard .ui-count{display:inline-block;flex:none;min-width:20px;height:20px;margin:0;padding:0 6px;border:0!important;border-radius:999px!important;background:var(--ui-hover)!important;color:var(--ui-text-2)!important;font:500 12px/20px var(--ui-font)!important;letter-spacing:0;text-align:center;text-transform:none;font-variant-numeric:tabular-nums;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-count:empty{display:none}
body.brand-page.account-page #dashboard .ui-count.is-sm{min-width:18px;height:18px;font-size:11px!important;line-height:18px!important}
body.brand-page.account-page #dashboard .ui-tab[aria-selected=true] .ui-count{background:var(--ui-accent-soft)!important;color:var(--ui-accent)!important}
body.brand-page.account-page #dashboard :is(.ui-tab,.ui-menu-item)[data-alert=true] .ui-count{background:var(--ui-danger-soft)!important;color:var(--ui-danger-text)!important}
body.brand-page.account-page #dashboard .ui-kind{display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:6px;background:var(--ui-hover);color:var(--ui-text-2)}
body.brand-page.account-page #dashboard .ui-kind[data-kind=ticket]{background:#fff6ed;color:#c4320a}
body.brand-page.account-page #dashboard .ui-kind[data-kind=case]{background:var(--ui-accent-soft);color:var(--ui-accent)}
body.brand-page.account-page #dashboard .ui-kind[data-kind=flow]{background:#f0fdf9;color:#107569}
body.brand-page.account-page #dashboard .ui-kind.is-sm{width:22px;height:22px;border-radius:5px}
body.brand-page.account-page #dashboard .ui-kind.is-sm .ui-ico{width:13px;height:13px}
body.brand-page.account-page #dashboard .ui-kind.is-xs{width:20px;height:20px;border-radius:5px}
body.brand-page.account-page #dashboard .ui-kind.is-xs .ui-ico{width:12px;height:12px}
body.brand-page.account-page #dashboard .ui-person{display:inline-flex;align-items:center;gap:8px;max-width:100%;min-width:0;vertical-align:middle}
body.brand-page.account-page #dashboard .ui-person-name{overflow:hidden;min-width:0;color:var(--ui-ink);font-size:13px;font-weight:500;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-avatar{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:var(--ui-accent-soft);color:var(--ui-accent);font:600 10px/1 var(--ui-font);letter-spacing:.02em}
body.brand-page.account-page #dashboard .ui-avatar[data-tone="1"]{background:#f4f3ff;color:#5925dc}
body.brand-page.account-page #dashboard .ui-avatar[data-tone="2"]{background:#ecfdf3;color:#067647}
body.brand-page.account-page #dashboard .ui-avatar[data-tone="3"]{background:#fff6ed;color:#c4320a}
body.brand-page.account-page #dashboard .ui-avatar[data-tone="4"]{background:#fdf2fa;color:#c11574}
body.brand-page.account-page #dashboard .ui-avatar[data-tone="5"]{background:#f0f9ff;color:#026aa2}
body.brand-page.account-page #dashboard .ui-people{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-width:0}
body.brand-page.account-page #dashboard .ui-none{color:var(--ui-faint);font-size:13px;white-space:nowrap}
body.brand-page.account-page #dashboard .ui-due{display:inline-flex;align-items:center;gap:4px;color:var(--ui-text);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
body.brand-page.account-page #dashboard .ui-due.is-overdue{color:var(--ui-danger-text);font-weight:600}
body.brand-page.account-page #dashboard .ui-due .ui-ico{width:14px;height:14px}
body.brand-page.account-page #dashboard .ui-time{color:var(--ui-muted);font-size:13px}
body.brand-page.account-page #dashboard .ui-time time{color:inherit}
body.brand-page.account-page #dashboard .ui-sev{display:inline-flex;align-items:center;gap:6px;color:var(--ui-ink);font-size:13px;font-weight:500}
body.brand-page.account-page #dashboard .ui-sev::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--ui-sev,var(--ui-faint))}

/* 4.13 Empty, loading and error states (= .w-state, work.css:289-304) */
body.brand-page.account-page #dashboard .ui-empty{display:grid;justify-items:center;gap:8px;margin:0;padding:56px 24px;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;color:var(--ui-text);text-align:center;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-empty.is-compact{padding:32px 16px;border:0!important}
body.brand-page.account-page #dashboard .ui-empty-icon{display:grid;place-items:center;width:44px;height:44px;margin-bottom:4px;border-radius:50%;background:var(--ui-hover);color:var(--ui-text-2)}
body.brand-page.account-page #dashboard .ui-empty-icon .ui-ico{width:20px;height:20px}
body.brand-page.account-page #dashboard .ui-empty.is-error .ui-empty-icon{background:var(--ui-danger-soft);color:var(--ui-danger)}
body.brand-page.account-page #dashboard .ui-empty-title{margin:0;color:var(--ui-ink)!important;font:600 15px/1.4 var(--ui-font)!important;letter-spacing:0}
body.brand-page.account-page #dashboard .ui-empty-text{max-width:46ch;margin:0 0 8px;color:var(--ui-muted);font-size:13px;line-height:1.5}
body.brand-page.account-page #dashboard .ui-empty .ui-actions{justify-content:center}
body.brand-page.account-page #dashboard .ui-inline-error{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:var(--ui-danger-text);font-size:13px}
body.brand-page.account-page #dashboard .ui-skel{display:block;width:62%;height:10px;margin:4px 0;border-radius:4px;background:linear-gradient(90deg,#eef1f5 25%,#f7f8fa 50%,#eef1f5 75%);background-size:200% 100%;animation:ui-shimmer 1.4s ease-in-out infinite}
body.brand-page.account-page #dashboard .ui-skel-lg{width:78%;height:12px}
body.brand-page.account-page #dashboard .ui-skel-sm{width:40%}
body.brand-page.account-page #dashboard .ui-skel-pill{width:72px;height:20px;border-radius:999px}
body.brand-page.account-page #dashboard .ui-skel-block{width:100%;height:120px;margin-top:16px;border-radius:8px}
body.brand-page.account-page #dashboard .ui-col-body>.ui-skel-block{height:88px;margin:0}
/* A field-sized placeholder (forms that load their values: preferences, the method search). */
body.brand-page.account-page #dashboard .ui-skel-field{width:100%;height:36px;margin:0;border-radius:6px}
@keyframes ui-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}

/* 4.14 Disclosure */
body.brand-page.account-page #dashboard .ui-details{min-width:0;margin:0;padding:0;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-details+.ui-details{margin-top:12px}
body.brand-page.account-page #dashboard .ui-details>summary{display:flex;align-items:center;gap:8px;min-height:44px;margin:0;padding:10px 16px;border-radius:8px!important;background:transparent!important;color:var(--ui-ink)!important;font:600 14px/1.4 var(--ui-font)!important;list-style:none;text-decoration:none!important;cursor:pointer}
body.brand-page.account-page #dashboard .ui-details>summary::-webkit-details-marker{display:none}
body.brand-page.account-page #dashboard .ui-details>summary::after{content:"";flex:none;box-sizing:border-box;width:7px;height:7px;margin:0 4px 3px auto;border:solid var(--ui-muted);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
body.brand-page.account-page #dashboard .ui-details[open]>summary{border-bottom:1px solid var(--ui-line);border-radius:8px 8px 0 0!important}
body.brand-page.account-page #dashboard .ui-details[open]>summary::after{margin-top:3px;margin-bottom:0;transform:rotate(-135deg)}
body.brand-page.account-page #dashboard .ui-details>summary:focus-visible{outline-offset:-2px!important}
body.brand-page.account-page #dashboard .ui-details-body{display:grid;gap:12px;min-width:0;padding:16px}
body.brand-page.account-page #dashboard .ui-details.is-inline{border:0!important;border-radius:0!important;background:transparent!important}
body.brand-page.account-page #dashboard .ui-details.is-inline>summary{display:inline-flex;min-height:32px;padding:0;border-radius:4px!important;color:var(--ui-accent)!important;font:600 13px/1.4 var(--ui-font)!important}
body.brand-page.account-page #dashboard .ui-details.is-inline>summary::after{margin:0 0 3px 6px;border-color:currentColor}
body.brand-page.account-page #dashboard .ui-details.is-inline[open]>summary{border-bottom:0;border-radius:4px!important}
body.brand-page.account-page #dashboard .ui-details.is-inline[open]>summary::after{margin:3px 0 0 6px}
body.brand-page.account-page #dashboard .ui-details.is-inline>summary:focus-visible{outline-offset:2px!important}
body.brand-page.account-page #dashboard .ui-details.is-inline>.ui-details-body{padding:8px 0 0}

/* 4.15 Pager and load more (= .w-pager, work.css:307-308) */
body.brand-page.account-page #dashboard .ui-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;margin:12px 0 0;color:var(--ui-muted);font-size:13px}
body.brand-page.account-page #dashboard .ui-pager-text{margin-right:4px;font-variant-numeric:tabular-nums}
body.brand-page.account-page #dashboard .ui-loadmore{display:flex;justify-content:center;margin:12px 0 0}
body.brand-page.account-page #dashboard .ui-loadmore:not(:has(>:not([hidden]))){display:none}

/* 4.17 Sections inside a page (inset = .w-section, work.css:362-364) */
body.brand-page.account-page #dashboard .ui-section{min-width:0;margin:24px 0 0;padding:0;border:0}
body.brand-page.account-page #dashboard .ui-section:first-child{margin-top:0}
body.brand-page.account-page #dashboard .ui-section-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:0 0 12px}
body.brand-page.account-page #dashboard .ui-section-title{display:flex;align-items:center;gap:6px;margin:0;color:var(--ui-ink)!important;font:600 15px/1.4 var(--ui-font)!important;letter-spacing:0;text-transform:none}
body.brand-page.account-page #dashboard .ui-section-meta{color:var(--ui-muted);font-size:13px}
body.brand-page.account-page #dashboard .ui-section.is-inset{display:grid;gap:10px;margin:0;padding:16px 0;border-top:1px solid var(--ui-line)}
body.brand-page.account-page #dashboard .ui-section.is-inset:first-child{padding-top:0;border-top:0}
body.brand-page.account-page #dashboard .ui-section.is-inset>.ui-section-title,body.brand-page.account-page #dashboard .ui-section.is-inset>.ui-section-head>.ui-section-title{color:var(--ui-muted)!important;font:600 12px/1.2 var(--ui-font)!important;letter-spacing:.04em;text-transform:uppercase}
body.brand-page.account-page #dashboard .ui-section.is-inset>.ui-section-head{margin:0}

/* 4.18 Key-value list and facts (= .w-dl work.css:376-379, .w-facts 347-350) */
body.brand-page.account-page #dashboard .ui-dl{display:grid;grid-template-columns:minmax(104px,38%) minmax(0,1fr);gap:8px 12px;min-width:0;margin:0}
body.brand-page.account-page #dashboard .ui-dl>div{display:contents}
body.brand-page.account-page #dashboard .ui-dl dt{margin:0;color:var(--ui-muted);font-size:13px;font-weight:400}
body.brand-page.account-page #dashboard .ui-dl dd{min-width:0;margin:0;color:var(--ui-ink);font-size:13px;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px;min-width:0;margin:0}
body.brand-page.account-page #dashboard .ui-facts>:is(.ui-fact,div){display:grid;gap:4px;min-width:0}
body.brand-page.account-page #dashboard .ui-facts dt{margin:0;color:var(--ui-muted);font-size:12px;font-weight:500}
body.brand-page.account-page #dashboard .ui-facts dd{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0;margin:0;color:var(--ui-ink);font-size:13px}

/* 4.19 Timeline (= .w-timeline, work.css:382-395) */
body.brand-page.account-page #dashboard .ui-timeline{display:grid;min-width:0;margin:0;padding:0;list-style:none}
body.brand-page.account-page #dashboard .ui-event{position:relative;display:grid;grid-template-columns:12px minmax(0,1fr);gap:10px;margin:0;padding:0 0 14px}
body.brand-page.account-page #dashboard .ui-event::before{content:"";position:absolute;top:14px;bottom:-2px;left:5px;width:1px;background:var(--ui-line)}
body.brand-page.account-page #dashboard .ui-event:last-child{padding-bottom:4px}
body.brand-page.account-page #dashboard .ui-event:last-child::before{display:none}
body.brand-page.account-page #dashboard .ui-event-dot{box-sizing:border-box;width:9px;height:9px;margin:5px 0 0 1px;border:2px solid #fff;border-radius:50%;background:var(--ui-faint);box-shadow:0 0 0 1px var(--ui-line-strong)}
body.brand-page.account-page #dashboard .ui-event[data-tone=accent] .ui-event-dot{background:var(--ui-accent);box-shadow:0 0 0 1px var(--ui-accent-line)}
body.brand-page.account-page #dashboard .ui-event-body{display:grid;gap:2px;min-width:0}
body.brand-page.account-page #dashboard .ui-event-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;color:var(--ui-ink);font-size:13px;line-height:1.45}
body.brand-page.account-page #dashboard .ui-event-head strong{font-weight:600}
body.brand-page.account-page #dashboard .ui-event-actor{color:var(--ui-muted)}
body.brand-page.account-page #dashboard .ui-event-actor::before{content:"· "}
body.brand-page.account-page #dashboard .ui-event-msg{margin:0;color:var(--ui-text);font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-event-time{color:var(--ui-faint);font-size:12px}

/* 4.20 Dialogs (= .w-dialog, work.css:398-409). showModal() puts them in the top layer; they stay inside #dashboard so these
   rules match. A dialog may hold .ui-dialog-form, or head and body directly: both scroll the body only. */
body.brand-page.account-page #dashboard .ui-dialog{width:min(520px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0;border:0!important;border-radius:12px!important;background:#fff!important;color:var(--ui-text);font:400 14px/1.45 var(--ui-font);box-shadow:var(--ui-shadow-dialog)!important;overflow:hidden}
body.brand-page.account-page #dashboard .ui-dialog[open]{display:flex;flex-direction:column;animation:ui-dialog-in .16s ease-out}
body.brand-page.account-page #dashboard .ui-dialog.ui-dialog-sm{width:min(440px,calc(100vw - 32px))}
body.brand-page.account-page #dashboard .ui-dialog.ui-dialog-lg{width:min(640px,calc(100vw - 32px))}
body.brand-page.account-page #dashboard .ui-dialog::backdrop{background:var(--ui-backdrop,rgba(16,24,40,.45))}
body.brand-page.account-page #dashboard .ui-dialog-form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;max-height:calc(100dvh - 48px);margin:0}
body.brand-page.account-page #dashboard .ui-dialog-head{display:flex;flex:none;align-items:flex-start;justify-content:space-between;gap:12px;margin:0;padding:20px 16px 12px 20px}
body.brand-page.account-page #dashboard .ui-dialog-head>div{min-width:0}
body.brand-page.account-page #dashboard .ui-dialog-title{margin:0;color:var(--ui-ink)!important;font:600 17px/1.35 var(--ui-font)!important;letter-spacing:0;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .ui-dialog-sub{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:2px 0 0;color:var(--ui-muted);font-size:13px}
body.brand-page.account-page #dashboard .ui-dialog-body{display:grid;gap:16px;flex:1 1 auto;min-height:0;padding:4px 20px 20px;overflow-y:auto;overscroll-behavior:contain}
body.brand-page.account-page #dashboard .ui-dialog-foot{display:flex;flex:none;justify-content:flex-end;gap:8px;margin:0;padding:12px 20px;border-top:1px solid var(--ui-line);background:var(--ui-subtle)}
/* A destructive action on the dialog's subject („Șterge regula…”) opens the foot, away from the primary at the end. */
body.brand-page.account-page #dashboard .ui-dialog-foot>.ui-btn-danger-ghost{margin-right:auto}
@keyframes ui-dialog-in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}

/* 4.24 Steps (the look of Lucru's drawer stepper, work.css .w-steps, in one row): a case on its way to its first activation, a
   row of its own under the case header (#caseSteps), as wide as the content. Done = a check on green, current = the stage
   pill's tone (data-tone, set by IGovUI.steps), upcoming = muted; a connector after each step. No motion. Below 560px of room
   only the current step keeps its label (the container query at the end of this block). */
body.brand-page.account-page #dashboard .ui-steps-wrap{container:uisteps/inline-size;min-width:0;margin:0 0 16px}
body.brand-page.account-page #dashboard .ui-steps{display:flex;align-items:center;gap:6px;min-width:0;margin:0;padding:0;list-style:none}
body.brand-page.account-page #dashboard .ui-step{display:flex;flex:0 1 auto;align-items:center;gap:6px;min-width:0;color:var(--ui-muted);font:500 13px/22px var(--ui-font)}
/* The connector is sized by width, not flex-basis: a flex item's basis does not count in its step's intrinsic width, so a
   24px basis made every step 16px too narrow and cut its label. */
body.brand-page.account-page #dashboard .ui-step:not(:last-child)::after{content:"";flex:0 1 auto;width:24px;min-width:8px;height:2px;border-radius:1px;background:var(--ui-step-line)}
body.brand-page.account-page #dashboard .ui-step-mark{display:inline-grid;flex:none;place-items:center;box-sizing:border-box;width:22px;height:22px;border:var(--ui-step-ring) solid var(--ui-line-strong);border-radius:50%;background:var(--ui-bg);color:var(--ui-muted);font:600 11px/1 var(--ui-font);font-variant-numeric:tabular-nums}
body.brand-page.account-page #dashboard .ui-step-mark .ui-ico{width:12px;height:12px;stroke-width:3}
body.brand-page.account-page #dashboard .ui-step-label{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-step[data-state=done]{color:var(--ui-text)}
body.brand-page.account-page #dashboard .ui-step[data-state=done]::after{background:var(--ui-step-line-done)}
body.brand-page.account-page #dashboard .ui-step[data-state=done] .ui-step-mark{border-color:var(--ui-step-done);background:var(--ui-step-done);color:var(--ui-bg)}
body.brand-page.account-page #dashboard .ui-step[aria-current=step]{color:var(--ui-ink);font-weight:600}
body.brand-page.account-page #dashboard .ui-step[aria-current=step] .ui-step-mark{border:var(--ui-step-ring) solid var(--ui-step-fg,var(--ui-accent));background:var(--ui-step-bg,var(--ui-accent-soft));color:var(--ui-step-fg,var(--ui-accent))}
/* The tones of the pills (4.12), as tokens. */
body.brand-page.account-page #dashboard .ui-step[data-tone=neutral]{--ui-step-fg:var(--ui-text-2);--ui-step-bg:var(--ui-hover)}
body.brand-page.account-page #dashboard .ui-step[data-tone=info]{--ui-step-fg:var(--ui-info-text);--ui-step-bg:var(--ui-info-soft)}
body.brand-page.account-page #dashboard .ui-step[data-tone=progress]{--ui-step-fg:var(--ui-progress);--ui-step-bg:var(--ui-progress-soft)}
body.brand-page.account-page #dashboard .ui-step[data-tone=warn]{--ui-step-fg:var(--ui-warning-strong);--ui-step-bg:var(--ui-warning-soft)}
body.brand-page.account-page #dashboard .ui-step[data-tone=ok]{--ui-step-fg:var(--ui-success);--ui-step-bg:var(--ui-success-soft)}
body.brand-page.account-page #dashboard .ui-step[data-tone=bad]{--ui-step-fg:var(--ui-danger-text);--ui-step-bg:var(--ui-danger-soft)}
/* A sub-line under a step's label (account.js caseSteps: the part of „Test” under way), two short lines next to the mark. */
body.brand-page.account-page #dashboard .ui-step-text{display:grid;min-width:0;line-height:16px}
body.brand-page.account-page #dashboard .ui-step-sub{min-width:0;overflow:hidden;color:var(--ui-muted);font:500 11px/14px var(--ui-font);white-space:nowrap;text-overflow:ellipsis}
/* Less than 560px of room (a phone): every mark stays, only the current step keeps its label; the others are read by screen
   readers only. The full row needs about 547px, the compact one about 263px (a 320px phone leaves 288px). With every step done (an
   activated monitoring waiting for its first result, A5.3) the last one keeps its label: „Activare ✓”, not five bare marks. */
@container uisteps (max-width:559px){
  body.brand-page.account-page #dashboard .ui-steps{gap:4px}
  body.brand-page.account-page #dashboard .ui-step:not([aria-current=step]):not(:last-child[data-state=done]) .ui-step-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  body.brand-page.account-page #dashboard .ui-step:not(:last-child)::after{width:8px}
}

/* ==========================================================================================================================
   5. Tier B: legacy mapping (UI-KIT 5, rows marked CSS). Prefix (1,2,1):
      body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))
   Generic element rules come first (rows 57-60), so the component rows after them refine them at equal specificity.
   ========================================================================================================================== */

/* Row 57: a bare label is a field (.ui-field + .ui-label); a bare label around a checkbox is an inline check. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(label:not([class]):not(:has(>input[type=checkbox],>input[type=radio]))){display:grid;gap:6px;min-width:0;margin:0;color:var(--ui-ink)!important;font:600 13px/1.35 var(--ui-font)!important;letter-spacing:0}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(label:not([class]):has(>input[type=checkbox],>input[type=radio])){display:flex;align-items:flex-start;gap:8px;margin:0;color:var(--ui-text)!important;font:400 14px/20px var(--ui-font)!important}
/* Row 58: bare fields are .ui-input (checkbox, radio, hidden, buttons and kit- or Lucru-classed fields excluded). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([type=checkbox],[type=radio],[type=hidden],[type=submit],[type=button],[type=reset],[type=file],[type=range],[type=color],[type=image],[class*="ui-"],[class^="w-"],[class*=" w-"]),select:not([class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])){display:block;width:100%;min-width:0;max-width:100%;min-height:36px;margin:0;padding:7px 10px;border:1px solid var(--ui-line-strong)!important;border-radius:6px!important;background-color:#fff!important;color:var(--ui-ink)!important;font:400 14px/1.4 var(--ui-font)!important;letter-spacing:0;box-shadow:none!important;transition:border-color .15s}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([type=checkbox],[type=radio],[type=hidden],[type=submit],[type=button],[type=reset],[type=file],[type=range],[type=color],[type=image],[class*="ui-"],[class^="w-"],[class*=" w-"]),select:not([class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])):where(:hover:not(:disabled)){border-color:var(--ui-field-hover)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([type=checkbox],[type=radio],[type=hidden],[type=submit],[type=button],[type=reset],[type=file],[type=range],[type=color],[type=image],[class*="ui-"],[class^="w-"],[class*=" w-"]),select:not([class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])):where(:focus-visible){outline:2px solid var(--ui-accent)!important;outline-offset:0!important;border-color:var(--ui-accent)!important;background-color:#fff!important;color:var(--ui-ink)!important;box-shadow:none!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"]))::placeholder{color:var(--ui-faint);opacity:1}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])){min-height:84px;resize:vertical}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(select:not([class*="ui-"],[class^="w-"],[class*=" w-"],[multiple])){-webkit-appearance:none;appearance:none;padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 10px center!important;background-size:14px!important;cursor:pointer}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input[type=search]:not([class*="ui-"],[class^="w-"],[class*=" w-"])){-webkit-appearance:none;appearance:none}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([type=checkbox],[type=radio],[class*="ui-"],[class^="w-"],[class*=" w-"]),select:not([class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])):where(:disabled){background-color:var(--ui-subtle)!important;color:var(--ui-faint)!important;cursor:not-allowed}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([type=checkbox],[type=radio],[class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])):where([readonly]){background-color:var(--ui-subtle)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input[type=checkbox]:not([class*="ui-"],[class^="w-"],[class*=" w-"]),input[type=radio]:not([class*="ui-"],[class^="w-"],[class*=" w-"])){flex:none;width:16px;height:16px;margin:2px 0 0;accent-color:var(--ui-accent);cursor:pointer}
/* Legacy forms inside cards and disclosures keep a readable measure. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel,details) :where(form:not([class*="ui-"])){max-width:720px}
/* Row 59: bare links read as .ui-link (accent, 1px underline, never purple). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(a:not([class])){color:var(--ui-accent)!important;font-weight:500;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:2px;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(a:not([class]):hover){color:var(--ui-accent-hover)!important;text-decoration-thickness:2px!important}
/* Row 60: h3 and h4 inside legacy cards (inset sections refine their h3 below, row 43). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel,.notification-item,.access-request,.board-card) :where(h3:not([class*="ui-"])){margin:16px 0 6px;color:var(--ui-ink)!important;font:600 14px/1.4 var(--ui-font)!important;letter-spacing:0;text-transform:none}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel,.notification-item,.access-request,.board-card) :where(h4:not([class*="ui-"])){margin:12px 0 4px;color:var(--ui-ink)!important;font:600 13px/1.4 var(--ui-font)!important;letter-spacing:0;text-transform:none}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel,.notification-item,.access-request,.board-card) :where(h3:not([class*="ui-"]):first-child,h4:not([class*="ui-"]):first-child){margin-top:0}

/* Row 1: .brand-button is a .ui-btn (hover, disabled, focus). It may wrap a long legacy label instead of overflowing. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button:not([class*="ui-"])){display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;margin:0;padding:5px 12px;border:1px solid var(--ui-line-strong)!important;border-radius:6px!important;background:#fff!important;color:var(--ui-text)!important;font:500 14px/1.2 var(--ui-font)!important;text-align:center;text-decoration:none!important;text-transform:none;letter-spacing:0;white-space:normal;cursor:pointer;box-shadow:none!important;transition:background-color .15s,border-color .15s,color .15s}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button:not([class*="ui-"]):hover:not(:disabled)){background:var(--ui-hover)!important;border-color:var(--ui-line-hover)!important;color:var(--ui-ink)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button:not([class*="ui-"]):disabled){opacity:.5;cursor:not-allowed;color:var(--ui-text)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button:not([class*="ui-"])[aria-disabled=true]){opacity:.55;cursor:not-allowed}
/* Row 2: .brand-button.primary is .ui-btn-primary (beats brand.css:584/614's green). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button.primary:not([class*="ui-"])){background:var(--ui-accent)!important;border-color:var(--ui-accent)!important;color:#fff!important;font-weight:600!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button.primary:not([class*="ui-"]):hover:not(:disabled)){background:var(--ui-accent-hover)!important;border-color:var(--ui-accent-hover)!important;color:#fff!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button.primary:not([class*="ui-"]):disabled){color:#fff!important}

/* Row 3: .account-section-heading is a .ui-head; its h2 a .ui-title; its description (>div>p) a visible .ui-summary. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(.account-section-heading){display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:12px 16px;margin:0 0 16px}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(.account-section-heading)>:where(div,h2){flex:1 1 auto;min-width:0}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(.account-section-heading) :where(h2:not([class*="ui-"])){margin:0;color:var(--ui-ink)!important;font:600 20px/28px var(--ui-font)!important;letter-spacing:-.01em;text-transform:none;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(.account-section-heading)>:where(div)>:where(p:not([class*="ui-"]):not([hidden])){display:block!important;max-width:none;margin:4px 0 0;color:var(--ui-muted)!important;font:400 13px/1.5 var(--ui-font)!important}
/* Row 4: an h2 placed directly in a page section is a .ui-title; a description right after it reads as an intro. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(h2:not([class*="ui-"])){margin:0 0 4px;color:var(--ui-ink)!important;font:600 20px/28px var(--ui-font)!important;letter-spacing:-.01em;text-transform:none;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(h2:not([class*="ui-"])+p:not([class])){max-width:72ch;margin:0 0 16px;color:var(--ui-muted)!important;font:400 14px/1.55 var(--ui-font)!important}

/* Row 6: an .account-panel inside a page is a .ui-card (a whole-page section loses the class in cont.html, K-5). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel:not(details):not([class*="ui-"])){min-width:0;margin:0 0 16px!important;padding:16px 20px!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important;color:var(--ui-text)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel:not(details))>:where(h2:not([class*="ui-"])){margin:0 0 12px;color:var(--ui-ink)!important;font:600 15px/1.4 var(--ui-font)!important;letter-spacing:0;text-transform:none}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel:not(details))>:where(p:not([class])){margin:0 0 12px;color:var(--ui-text)!important;font-size:14px!important;line-height:1.55!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel:not(details))>:where(:last-child){margin-bottom:0}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-panel) :where(.account-panel:not(details):not([class*="ui-"])){margin:12px 0 0!important;padding:12px 16px!important}
/* Rows 7, 42, 56: classed legacy disclosures are a .ui-details (a summary row with a chevron; body padding 0 16px 16px). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"])){min-width:0;margin:0 0 16px!important;padding:0 16px!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important;color:var(--ui-text)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"])[open]){padding-bottom:16px!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"]))>:where(summary){display:flex;align-items:center;gap:8px;min-height:44px;margin:0 -16px;padding:10px 16px;border-radius:8px!important;background:transparent!important;color:var(--ui-ink)!important;font:600 14px/1.4 var(--ui-font)!important;letter-spacing:0;list-style:none;text-decoration:none!important;cursor:pointer}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"])[open])>:where(summary){margin-bottom:12px;border-bottom:1px solid var(--ui-line);border-radius:8px 8px 0 0!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"]))>:where(summary)::after{content:"";flex:none;box-sizing:border-box;width:7px;height:7px;margin:0 4px 3px auto;border:solid var(--ui-muted);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"])[open])>:where(summary)::after{margin-top:3px;margin-bottom:0;transform:rotate(-135deg)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"]))>:where(summary+*){margin-top:0}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules):where(:not([class*="ui-"]))>:where(summary:focus-visible){outline-offset:-2px!important}
/* Row 42: bare nested disclosures (monitoring editor) are a .ui-details.is-inline. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details:not([class])){min-width:0;margin:8px 0 0;padding:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details:not([class]))>:where(summary){display:inline-flex;align-items:center;gap:0;min-height:32px;margin:0;padding:0;border-radius:4px!important;background:transparent!important;color:var(--ui-accent)!important;font:600 13px/1.4 var(--ui-font)!important;letter-spacing:0;list-style:none;text-decoration:none!important;cursor:pointer}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details:not([class]))>:where(summary)::after{content:"";flex:none;box-sizing:border-box;width:7px;height:7px;margin:0 0 3px 8px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details:not([class])[open])>:where(summary){margin-bottom:8px}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details:not([class])[open])>:where(summary)::after{margin:3px 0 0 8px;transform:rotate(-135deg)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(details.account-panel,details.monitor-configuration,details.monitor-history,details.architecture-relations,details.architecture-rules,details:not([class]))>:where(summary)::-webkit-details-marker{display:none}

/* Row 8: .account-actions is a .ui-actions. Row 9: .account-note is a .ui-note (inside a label: .ui-opt). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-actions:not([class*="ui-"])){display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 0}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-note:not([class*="ui-"])){color:var(--ui-muted)!important;font:400 13px/1.5 var(--ui-font)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(label .account-note:not([class*="ui-"])){display:inline;margin:0;color:var(--ui-faint)!important;font:400 12px/1.35 var(--ui-font)!important}
/* Row 10: .account-empty reads like a compact empty state, left aligned. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-empty:not([class*="ui-"])){display:block;margin:0;padding:16px 0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--ui-muted)!important;font:400 14px/1.5 var(--ui-font)!important;text-align:left}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-empty:not([class*="ui-"])) :where(strong){display:block;color:var(--ui-ink);font:600 15px/1.4 var(--ui-font)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-empty:not([class*="ui-"])) :where(p){margin:4px 0 12px}
/* Row 12: .account-check is a .ui-check-inline; hidden ones stay hidden. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-check:not([class*="ui-"]):not([hidden])){display:flex!important;align-items:flex-start;gap:8px!important;margin:0;color:var(--ui-text)!important;font:400 14px/20px var(--ui-font)!important;cursor:pointer}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-check[hidden]){display:none!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-check) :where(input[type=checkbox]){flex:none;width:16px;height:16px;margin:2px 0 0;accent-color:var(--ui-accent)}

/* Row 14: legacy filter containers are a .ui-filters surface (a 16px-gap stack, as the shell drew them before K-26); labels
   .ui-label-sm, fields .ui-input, checks .ui-check-inline. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(:is(.control-toolbar,.board-toolbar,#caseFilterPanel):not([class*="ui-"])){container:uifilters/inline-size;display:grid;align-content:start;gap:16px;margin:0 0 16px;padding:16px!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:var(--ui-subtle)!important;box-shadow:none!important;color:var(--ui-text);font:400 14px/1.45 var(--ui-font)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(:is(.control-toolbar,.board-toolbar,#caseFilterPanel):not([class*="ui-"])) :where(form:not([class*="ui-"]),.account-filters){display:grid;grid-template-columns:minmax(0,1fr);gap:12px;max-width:none;margin:0;padding:0;border:0;background:transparent}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(:is(.control-toolbar,.board-toolbar,#caseFilterPanel):not([class*="ui-"])) :where(label:not([class])){display:grid;gap:6px;min-width:0;margin:0;color:var(--ui-muted)!important;font:500 12px/1.35 var(--ui-font)!important}

/* Row 17: a pane of a tab strip (.control-tab-panel, control-panel.js) keeps outline:none. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.control-tab-panel){outline:none}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.control-tab-panel:focus-visible){outline:none!important}
/* Row 41: .account-status.error is a bad alert. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-status.error){display:block;min-height:0;margin:0 0 12px;padding:10px 12px!important;border:1px solid var(--ui-danger-line)!important;border-radius:8px!important;background:var(--ui-danger-soft)!important;color:var(--ui-danger-text)!important;font:400 13px/1.45 var(--ui-font)!important;box-shadow:none!important}

/* Row 36: .case-copy is text that keeps its line breaks (prose on the case page, section 6). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.case-copy){color:var(--ui-text);font:400 14px/1.55 var(--ui-font);white-space:pre-wrap;overflow-wrap:anywhere}
/* Row 37: case editors are chips. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.case-editors){display:flex;flex-wrap:wrap;align-items:center;gap:8px}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.case-editor){display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0;min-height:36px;margin:0;padding:4px 10px 4px 6px!important;border:1px solid var(--ui-line)!important;border-radius:999px!important;background:#fff!important;box-shadow:none!important;color:var(--ui-ink)!important;font:400 13px/1.4 var(--ui-font)!important;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.case-editor:not(:has(.ui-avatar))){padding-left:12px!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.case-editor.is-empty){border-style:dashed!important;color:var(--ui-faint)!important}
/* Row 38: article.case-event (case history, conversation clones, admin audit) reads as a dot-and-line timeline. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event){position:relative;display:grid;gap:2px;min-width:0;margin:0!important;padding:0 0 14px 22px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event)::before{content:"";position:absolute;top:5px;left:1px;box-sizing:border-box;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:var(--ui-faint);box-shadow:0 0 0 1px var(--ui-line-strong)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event)::after{content:"";position:absolute;top:16px;bottom:-2px;left:5px;width:1px;background:var(--ui-line)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event:last-child)::after{display:none}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event[data-event-kind=message])::before{background:var(--ui-accent);box-shadow:0 0 0 1px var(--ui-accent-line)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event) :where(strong){color:var(--ui-ink);font:600 13px/1.45 var(--ui-font)}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event) :where(p){margin:0;color:var(--ui-text)!important;font:400 13px/1.5 var(--ui-font)!important;white-space:pre-wrap}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(article.case-event) :where(small){color:var(--ui-faint);font:400 12px/1.45 var(--ui-font)}
/* Row 39: proposal dl, .manual-proof and dl.monitor-config-grid are a .ui-dl. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where([data-case-section] dl:not([class]),dl.manual-proof,dl.monitor-config-grid){display:grid;grid-template-columns:minmax(104px,38%) minmax(0,1fr);gap:8px 12px;min-width:0;margin:0 0 12px}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where([data-case-section] dl:not([class]),dl.manual-proof,dl.monitor-config-grid)>:where(div){display:contents}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where([data-case-section] dl:not([class]),dl.manual-proof,dl.monitor-config-grid) :where(dt){margin:0;color:var(--ui-muted)!important;font:400 13px/1.45 var(--ui-font)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where([data-case-section] dl:not([class]),dl.manual-proof,dl.monitor-config-grid) :where(dd){min-width:0;margin:0;color:var(--ui-ink)!important;font:400 13px/1.45 var(--ui-font)!important;overflow-wrap:anywhere}
/* Row 40: .monitor-next (hints, the closed-but-active warning) is an info .ui-offer. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.monitor-next:not([class*="ui-"])){display:grid;gap:6px;min-width:0;margin:0 0 16px;padding:12px 14px!important;border:1px solid var(--ui-accent-line)!important;border-radius:8px!important;background:var(--ui-accent-soft)!important;box-shadow:none!important;color:var(--ui-ink)!important;font:400 14px/1.45 var(--ui-font)!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.monitor-next:not([class*="ui-"])) :where(strong){font-weight:600}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.monitor-next:not([class*="ui-"])) :where(p){margin:0;color:var(--ui-text)!important}
/* Row 43: monitoring sub-blocks are .ui-section.is-inset (top rule, padding 16px 0); their h3 the 12px uppercase title. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.monitor-preview,.monitor-runtime,.manual-step,#activateMonitor,.mapping-column):where(:not([class*="ui-"])){min-width:0;margin:0!important;padding:16px 0!important;border:0!important;border-top:1px solid var(--ui-line)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.monitor-preview,.monitor-runtime,.manual-step,#activateMonitor)>:where(h3:not([class*="ui-"])){margin:0 0 10px;color:var(--ui-muted)!important;font:600 12px/1.2 var(--ui-font)!important;letter-spacing:.04em;text-transform:uppercase}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.mapping-column)>:where(legend){margin:0 0 8px;padding:0;color:var(--ui-ink)!important;font:600 13px/1.35 var(--ui-font)!important}
/* Row 44: field grids are two equal columns (one at 600px and narrower, section 9). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(div.monitor-config-grid){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;min-width:0}
/* Row 45: the report and the integration contract are mono blocks. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(pre.monitor-report,textarea.manual-contract){margin:0;padding:10px 12px!important;border:1px solid var(--ui-line)!important;border-radius:6px!important;background:var(--ui-subtle)!important;color:var(--ui-ink)!important;font:400 12px/1.55 var(--ui-mono)!important;box-shadow:none!important;overflow-wrap:anywhere}
/* Row 46: a disabled fieldset stays clearly disabled (operation_pending relies on it). */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(fieldset:disabled){opacity:.55}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(fieldset:disabled) :where(input,select,textarea,button,label){cursor:not-allowed}

/* Row 61: link lists (sources, evidence, runs) are plain disc lists; their links .ui-link. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(#monitoringEditor ul:not([class])){margin:8px 0;padding-left:18px;list-style:disc;color:var(--ui-text);font-size:13px;line-height:1.5}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(#monitoringEditor ul:not([class])>li){margin:2px 0}
/* Row 62: the citizen extras are a stack of disclosures. */
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-extras){display:grid;gap:12px;margin:24px 0 0}
body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.account-extras>details){margin:0!important}

/* ==========================================================================================================================
   6. Panel rules (K-34): rows 36-38 on the case page, 49-50 in integrations and personal data, 54-55 on the architecture
   page. Same specificity as tier B, scoped by the panel inside the :where(). The monitoring templates are on the kit: the
   legacy rows they still use (45 mono blocks, 46 disabled fieldsets, 61 link lists) are in section 5, and account.css draws
   the job card's state bar, steps and checks.
   ========================================================================================================================== */
/* Case page: the body is prose (row 36). */
body.brand-page.account-page #dashboard :where(#caseDetailPanel) :where(.case-copy:not(dd)){font-size:15px;line-height:1.6}
/* Echipă și acces (cont.html, K-14): a pane's note sits 12px above its list or timeline. */
body.brand-page.account-page #dashboard #adminPanel [data-admin-section]>.ui-note{margin:0 0 12px}
/* Integrations and personal-data requests: the verified badge is an ok tag; .verification-admin an inline disclosure with a
   top rule (row 50). The legacy rules skip kit markup; the migrated details.ui-details.is-inline.verification-admin sits in a
   row body (grid, 16px gap) and gets the rule of an inset section: (1,5,1) beats .ui-details.is-inline's border:0 (1,4,1). */
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(.institution-verified){display:inline-flex;align-items:center;gap:4px;max-width:100%;margin:0 0 8px;padding:0 6px!important;border:0!important;border-radius:4px!important;background:var(--ui-success-soft)!important;color:var(--ui-success)!important;font:500 11px/18px var(--ui-font)!important;white-space:normal;box-shadow:none!important}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(.institution-verified>span){display:inline-grid;place-items:center;width:12px;height:12px;border:0!important;border-radius:0!important;background:transparent!important;color:var(--ui-success)!important;font:600 11px/1 var(--ui-font)!important}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(details.verification-admin:not([class*="ui-"])){margin:16px 0 0!important;padding:12px 0 0!important;border:0!important;border-top:1px solid var(--ui-line)!important;border-radius:0!important;background:transparent!important}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(details.verification-admin:not([class*="ui-"])>summary){display:inline-flex;align-items:center;min-height:32px;margin:0;padding:0;border-radius:4px!important;background:transparent!important;color:var(--ui-accent)!important;font:600 13px/1.4 var(--ui-font)!important;list-style:none;text-decoration:none!important;cursor:pointer}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(details.verification-admin:not([class*="ui-"])>summary)::after{content:"";flex:none;box-sizing:border-box;width:7px;height:7px;margin:0 0 3px 8px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(details.verification-admin:not([class*="ui-"])[open]>summary){margin-bottom:8px}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(details.verification-admin:not([class*="ui-"])[open]>summary)::after{margin:3px 0 0 8px;transform:rotate(-135deg)}
body.brand-page.account-page #dashboard :where(#integrationsPanel,#privacyPanel) :where(details.verification-admin:not([class*="ui-"])>summary)::-webkit-details-marker{display:none}
body.brand-page.account-page #dashboard .ui-details.is-inline.verification-admin{padding-top:16px;border-top:1px solid var(--ui-line)!important}
/* Architecture: legend swatches get back the fills brand.css:225 removes (architecture.js:4); canvas and inspector. */
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-legend){display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 12px;color:var(--ui-muted);font:400 12px/1.4 var(--ui-font)}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.ui-toolbar>.architecture-legend){margin:0}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-legend>span){display:inline-flex;align-items:center;gap:6px}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-key){display:inline-block;flex:none;width:12px;height:12px;border:1px solid #536a7d!important;border-radius:3px!important;background:#f5f7f9!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-key-actors){border-color:#3977a8!important;background:#eff6ff!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-key-application){border-color:#536a7d!important;background:#f5f7f9!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-key-data){border-color:#39876c!important;background:#eef8f4!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-key-external){border-color:#85609f!important;background:#f5f1fa!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-workspace){gap:16px}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-canvas){border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-canvas:focus-visible){outline:2px solid var(--ui-accent)!important;outline-offset:2px!important}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-inspector){display:grid;align-content:start;gap:8px;min-width:0;padding:16px!important;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:var(--ui-subtle)!important;box-shadow:none!important;color:var(--ui-text)}
/* The inspector is a .ui-card (P3-28) on the subtle surface: (1,4,1) beats .ui-card's white (1,3,1). */
body.brand-page.account-page #dashboard .ui-card.architecture-inspector{background:var(--ui-subtle)!important}
/* The rules disclosure holds a plain list of sentences (architecture.css no longer sizes it, P3-30). */
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-rules ul){margin:0;padding:0 0 0 18px;list-style:disc;color:var(--ui-text);font-size:14px;line-height:1.55}
body.brand-page.account-page #dashboard :where(#architecturePanel) :where(.architecture-rules li+li){margin-top:8px}

/* ==========================================================================================================================
   7. Lucru deltas (K-30) live in work.css itself: .w-heading 20px/28px and .w-table .w-c-activity (muted, ellipsis).
   ========================================================================================================================== */

/* ==========================================================================================================================
   8. Toasts (K-31): restyle only. Their place is account.css's (top right under the account bar, at the top on phones) and their
   time account-toasts.js's (5 s; errors stay), PLAN-ergonomics A7.4. Toasts live outside #dashboard: (0,4,1) beats brand.css:592;
   the close button uses the never-matching-id idiom (1,3,1).
   ========================================================================================================================== */
body.brand-page.account-page .account-toasts .account-toast{gap:8px;padding:12px 8px 12px 14px;border:1px solid var(--ui-line)!important;border-left:3px solid var(--ui-accent)!important;border-radius:8px!important;background:#fff!important;box-shadow:var(--ui-shadow-menu)!important;color:var(--ui-ink)}
body.brand-page.account-page .account-toasts .account-toast p{color:var(--ui-ink);font:400 14px/1.5 var(--ui-font)}
body.brand-page.account-page .account-toasts .account-toast.error{border-left-color:var(--ui-danger)!important}
body.brand-page.account-page .account-toasts .account-toast.error p{color:var(--ui-danger-text);font-weight:500}
body.brand-page.account-page :is(.account-toasts,#_ui) .account-toast-close{display:grid;place-items:center;flex:none;width:32px;height:32px;margin:-6px 0;padding:0;border:0!important;border-radius:6px!important;background:transparent!important;color:var(--ui-muted)!important;font:400 20px/1 var(--ui-font)!important;text-decoration:none!important;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page :is(.account-toasts,#_ui) .account-toast-close:hover{background:var(--ui-hover)!important;color:var(--ui-ink)!important}

/* ==========================================================================================================================
   9. Responsive (767px, 600px, 480px), container queries, reduced motion, forced colours.
   ========================================================================================================================== */
/* Phones and small tablets: 40px controls, 16px field text (no iOS zoom), bottom-sheet dialogs. Lucru keeps its own sizes. */
@media(max-width:767px){
  body.brand-page.account-page #dashboard .ui-btn{min-height:40px}
  body.brand-page.account-page #dashboard .ui-btn-sm{min-height:36px}
  body.brand-page.account-page #dashboard :is(.ui-icon-btn,.ui-icon-btn.is-sm){width:40px;height:40px}
  body.brand-page.account-page #dashboard .ui-input,body.brand-page.account-page #dashboard .ui-input-sm{min-height:40px;font-size:16px!important}
  body.brand-page.account-page #dashboard .ui-skel-field{height:40px}
  body.brand-page.account-page #dashboard :is(.ui-chip,.ui-facet,.ui-menu-item){min-height:40px}
  body.brand-page.account-page #dashboard .ui-seg-btn{min-height:36px}
  body.brand-page.account-page #dashboard .ui-pager{justify-content:space-between}
  body.brand-page.account-page #dashboard .ui-table-matrix .ui-check{width:24px;height:24px}
  body.brand-page.account-page #dashboard .ui-dialog,body.brand-page.account-page #dashboard .ui-dialog.ui-dialog-sm,body.brand-page.account-page #dashboard .ui-dialog.ui-dialog-lg{width:100vw;max-height:92dvh;margin:auto 0 0;border-radius:16px 16px 0 0!important}
  body.brand-page.account-page #dashboard .ui-dialog-form{max-height:92dvh}
  body.brand-page.account-page #dashboard .ui-dialog-foot{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  body.brand-page.account-page #dashboard .ui-dialog-foot .ui-btn{flex:1;min-height:40px}
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(.brand-button:not([class*="ui-"])){min-height:40px}
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(input:not([type=checkbox],[type=radio],[type=hidden],[type=submit],[type=button],[type=reset],[type=file],[type=range],[type=color],[type=image],[class*="ui-"],[class^="w-"],[class*=" w-"]),select:not([class*="ui-"],[class^="w-"],[class*=" w-"]),textarea:not([class*="ui-"],[class^="w-"],[class*=" w-"])){min-height:40px;font-size:16px!important}
}
@media(max-width:600px){
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where(div.monitor-config-grid){grid-template-columns:minmax(0,1fr)}
  body.brand-page.account-page #dashboard .ui-board{grid-template-columns:repeat(5,86%);gap:10px;scroll-snap-type:x mandatory}
}
/* Narrow phones: header buttons with a .ui-collapse label become 40x40 icon buttons (primary buttons keep their label); pairs,
   facts and key-value lists go to one column. */
@media(max-width:480px){
  body.brand-page.account-page .ui-collapse{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}
  body.brand-page.account-page #dashboard .ui-btn-primary .ui-collapse{position:static!important;width:auto!important;height:auto!important;overflow:visible!important;clip:auto!important}
  body.brand-page.account-page #dashboard .ui-head-tools .ui-btn:not(.ui-btn-primary):has(>.ui-collapse){width:40px;min-width:40px;padding:0}
  /* When every header tool is one of those icons (Actualizează alone, on most pages), it stays on the title row. */
  body.brand-page.account-page #dashboard .ui-head:not(:has(.ui-head-tools :is(.ui-btn-primary,.ui-btn:not(:has(>.ui-collapse)),.ui-seg))){flex-wrap:nowrap;align-items:flex-start}
  body.brand-page.account-page #dashboard :is(.ui-pair,.ui-pair.is-even,.ui-facts){grid-template-columns:minmax(0,1fr)}
  body.brand-page.account-page #dashboard .ui-dl{grid-template-columns:minmax(0,1fr);gap:2px 0}
  body.brand-page.account-page #dashboard .ui-dl dd{margin-bottom:8px}
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where([data-case-section] dl:not([class]),dl.manual-proof,dl.monitor-config-grid){grid-template-columns:minmax(0,1fr);gap:2px 0}
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel)) :where([data-case-section] dl:not([class]),dl.manual-proof,dl.monitor-config-grid) :where(dd){margin-bottom:8px}
}
/* Filters (= work.css:109-125): from 250px the kinds become chips; from 280px two columns; from 640px one wrapping row. */
@container uifilters (min-width:250px){
  body.brand-page.account-page #dashboard .ui-facets{display:flex;flex-wrap:wrap;gap:6px}
  body.brand-page.account-page #dashboard .ui-facet{width:auto;border:1px solid var(--ui-line)!important;background:#fff!important}
  body.brand-page.account-page #dashboard .ui-facet[aria-pressed=true]{border-color:var(--ui-accent)!important;background:var(--ui-accent-soft)!important;box-shadow:none!important}
  body.brand-page.account-page #dashboard .ui-facet-label{flex:none}
}
@container uifilters (min-width:280px){
  body.brand-page.account-page #dashboard .ui-filters-in{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  body.brand-page.account-page #dashboard :is(.ui-field-search,.ui-field-kinds,.ui-reset){grid-column:1/-1}
}
@container uifilters (min-width:640px){
  body.brand-page.account-page #dashboard .ui-filters-in{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 16px}
  body.brand-page.account-page #dashboard .ui-field-kinds{flex:1 1 100%;order:-1}
  body.brand-page.account-page #dashboard .ui-field-search{flex:1 1 220px}
  body.brand-page.account-page #dashboard .ui-filters-in>.ui-field:not(.ui-field-search):not(.ui-field-kinds){flex:0 1 190px}
  body.brand-page.account-page #dashboard .ui-reset{align-self:center;margin-left:0}
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(:is(.control-toolbar,.board-toolbar,#caseFilterPanel):not([class*="ui-"])) :where(form:not([class*="ui-"]),.account-filters){display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 16px}
  body.brand-page.account-page #dashboard :where(.account-content>section:not(#workPanel))>:where(:is(.control-toolbar,.board-toolbar,#caseFilterPanel):not([class*="ui-"])) :where(form:not([class*="ui-"]),.account-filters)>:where(label){flex:1 1 190px}
}
/* Rows: in a list narrower than 560px the side column wraps under the text. */
@container uilist (max-width:559px){
  body.brand-page.account-page #dashboard .ui-row{grid-template-areas:"lead main" "side side";grid-template-columns:auto minmax(0,1fr)}
  body.brand-page.account-page #dashboard .ui-row-side{justify-content:flex-start;margin-left:0}
  body.brand-page.account-page #dashboard .ui-row-details>summary.ui-row:not(:has(>.ui-row-side))::after{justify-self:start;margin-left:0}
}
/* Tables follow their own width (= work.css:213-258): 1079px and narrower lose "next" and "time" (the next step moves under
   the subtitle); 759px and narrower get compact columns; 639px and narrower turn each row into a card. */
@container uitable (max-width:1079px){
  body.brand-page.account-page #dashboard .ui-table :is(.ui-col-next,.ui-col-time){display:none}
  body.brand-page.account-page #dashboard .ui-table:has(.ui-col-next) .ui-item-next{display:flex}
  body.brand-page.account-page #dashboard .ui-table .ui-col-status{width:124px}
  body.brand-page.account-page #dashboard .ui-table .ui-col-owner{width:128px}
  body.brand-page.account-page #dashboard .ui-table .ui-col-due{width:108px}
  body.brand-page.account-page #dashboard .ui-table .ui-col-action{width:100px}
}
@container uitable (max-width:759px){
  body.brand-page.account-page #dashboard .ui-table .ui-col-status{width:112px}
  body.brand-page.account-page #dashboard .ui-table .ui-col-owner{width:112px}
  body.brand-page.account-page #dashboard .ui-table .ui-col-due{width:92px}
  body.brand-page.account-page #dashboard .ui-table .ui-col-action{width:96px}
  body.brand-page.account-page #dashboard .ui-table .ui-due{white-space:normal}
  body.brand-page.account-page #dashboard .ui-table td{padding-left:10px;padding-right:10px}
}
@container uitable (max-width:639px){
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix),body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody{display:block}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"main main" "status due" "owner action" "next next";align-items:center;gap:6px 12px;padding:12px 12px 12px 14px;border-bottom:1px solid var(--ui-line);box-shadow:inset 3px 0 0 var(--ui-sev,transparent)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:first-child{border-radius:7px 7px 0 0}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:is(:last-child,:not([hidden]):not(:has(~tr:not([hidden])))){border-bottom:0;border-radius:0 0 7px 7px}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:first-child:is(:last-child,:not([hidden]):not(:has(~tr:not([hidden])))){border-radius:7px}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:hover{background:var(--ui-subtle)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr[data-selected]{background:var(--ui-selected)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr[aria-current=true]{background:var(--ui-accent-soft)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr.is-expanded{background:var(--ui-subtle);border-bottom:0}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr>:is(td,th){display:block;width:auto;min-width:0;padding:0;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr>[colspan]{grid-column:1/-1}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-main{grid-area:main}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-status{grid-area:status;justify-self:start;max-width:100%}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-due{grid-area:due;justify-self:end;text-align:right}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-time{display:block;grid-area:due;justify-self:end;text-align:right}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) tr:has(>.ui-col-due)>.ui-col-time{display:none}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) td.ui-col-time>*{max-width:none}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-owner{grid-area:owner;display:flex!important;flex-wrap:wrap;align-items:center;gap:2px 10px}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-action{grid-area:action;justify-self:end;text-align:right;white-space:normal}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-action>.ui-actions{flex-direction:row;flex-wrap:wrap;justify-content:flex-end}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-col-next{grid-area:next;display:block}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix):has(.ui-col-next) .ui-item-next{display:none}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix) .ui-due{white-space:nowrap}
  body.brand-page.account-page #dashboard .ui-table.has-hover-actions .ui-col-action .ui-btn:not(.is-pinned):not(.ui-btn-primary){opacity:1}
  /* Generic tables (members, sources): every cell with data-label becomes a "label value" line of the card. */
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label]){display:block}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:3px 0}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td[data-label]::before{content:attr(data-label);flex:none;min-width:96px;color:var(--ui-muted);font:400 12px/1.4 var(--ui-font)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td:is(.ui-col-main,.ui-col-action)::before{content:none}
  /* In a label/value card a number or a time reads like any other value, from the left (the right alignment and the due area
     belong to the table columns and to the Lucru-like cards above, whose cells carry no data-label). */
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td:is(.ui-col-num,.ui-col-time){justify-self:auto;text-align:left}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td.ui-col-main{padding-bottom:6px}
  /* A main cell's .ui-item has inline-size containment (no width of its own), so in this flex line it takes the card's width. */
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td.ui-col-main>.ui-item{flex:1 1 100%}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr:has(>td[data-label])>td.ui-col-action{justify-content:flex-end;padding-top:8px}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr.ui-table-detail{display:block;padding:0;box-shadow:none;background:var(--ui-subtle)}
  body.brand-page.account-page #dashboard .ui-table:not(.ui-table-matrix)>tbody>tr.ui-table-detail>td{display:block;padding:16px}
  body.brand-page.account-page #dashboard .ui-table-matrix .ui-col-check{width:64px;padding-left:6px;padding-right:6px}
}
@container uiregion (max-width:559px){
  body.brand-page.account-page #dashboard .ui-board{grid-template-columns:repeat(5,86%);gap:10px;scroll-snap-type:x mandatory}
}
/* Reduced motion: no shimmer, spin, dialog or toast animation. A pseudo-element is not valid inside :is(), so the busy
   button's own spinner (::before) has its own selector. */
@media(prefers-reduced-motion:reduce){
  body.brand-page.account-page #dashboard :is(.ui-skel,.ui-dialog[open],.ui-btn[aria-busy=true] .ui-ico),body.brand-page.account-page #dashboard .ui-btn[aria-busy=true]::before{animation:none!important}
  body.brand-page.account-page #dashboard :is(.ui-region,.ui-btn,.ui-input,.ui-card,.ui-col,.ui-tabs-more-ico,.ui-row-details>summary.ui-row .ui-row-side){transition:none!important}
  body.brand-page.account-page .account-toasts .account-toast{animation:none!important}
}
/* Forced colours: the selected tab and the current menu row get a 2px underline; pills and buttons a system-colour border;
   focus stays visible. */
@media(forced-colors:active){
  body.brand-page.account-page #dashboard .ui-tab[aria-selected=true],body.brand-page.account-page #dashboard .ui-menu-item:is(:focus-visible,[aria-current=true]){text-decoration:underline 2px!important;text-underline-offset:4px}
  body.brand-page.account-page #dashboard :is(.ui-pill,.ui-tag,.ui-count){border:1px solid CanvasText!important}
  body.brand-page.account-page #dashboard :is(.ui-btn,.ui-icon-btn,.ui-seg-btn,.ui-chip,.ui-facet){border:1px solid ButtonText!important}
  body.brand-page.account-page #dashboard :is(.ui-seg-btn,.ui-chip,.ui-facet)[aria-pressed=true]{text-decoration:underline 2px!important;text-underline-offset:3px}
  body.brand-page.account-page #dashboard .ui-step[aria-current=step] .ui-step-label{text-decoration:underline 2px;text-underline-offset:4px}
  /* The connectors and the done marks are drawn with backgrounds, which this mode repaints as Canvas: system colours (kept in
     this mode) draw them again, a done mark as a filled disc with its check in the page colour. */
  body.brand-page.account-page #dashboard .ui-step:not(:last-child)::after{background:CanvasText}
  body.brand-page.account-page #dashboard .ui-step[data-state=done] .ui-step-mark{border-color:CanvasText;background:CanvasText;color:Canvas}
  body.brand-page.account-page :where(#dashboard,.account-toasts) :focus-visible:where(:not(#workPanel,#workPanel *)){outline:2px solid Highlight!important}
}

/* phase 2 pages */
/* ==========================================================================================================================
   10. Phase 2 pages: the pieces "Reguli de lucru" (work-rules.js) added to the kit (tag field, listbox, dialog error band,
   the editor's wrapping foot, the rules table's row) and the "Lucru" line of Preferințe de notificare, with their own
   responsive, reduced-motion and forced-colour rules. On/off states have no switch: a pill shows the state and a button (or
   a dialog) changes it, as everywhere else in the account.
   Components are tier A like section 4, (1,3,1)+; the panel rules are scoped by the panel's id, like section 6.
   ========================================================================================================================== */
/* Tag field: a box with the look of .ui-input that holds the chosen values as removable chips and a borderless input (a free
   value on Enter, or a combobox with a .ui-listbox of suggestions); the focus ring of the input goes on the box. */
body.brand-page.account-page #dashboard .ui-tagbox{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0;min-height:36px;margin:0;padding:4px 6px;border:1px solid var(--ui-line-strong)!important;border-radius:6px!important;background:#fff!important;cursor:text;transition:border-color .15s}
body.brand-page.account-page #dashboard .ui-tagbox:hover{border-color:var(--ui-field-hover)!important}
body.brand-page.account-page #dashboard .ui-tagbox:has(>.ui-tagbox-input:focus){outline:2px solid var(--ui-accent);outline-offset:0;border-color:var(--ui-accent)!important}
body.brand-page.account-page #dashboard .ui-tagbox-chip{display:inline-flex;align-items:center;gap:2px;max-width:100%;min-height:24px;padding:0 2px 0 8px;border-radius:999px;background:var(--ui-accent-soft);color:var(--ui-accent);font:500 13px/1.2 var(--ui-font)}
body.brand-page.account-page #dashboard .ui-tagbox-text{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
body.brand-page.account-page #dashboard .ui-tagbox-x{display:inline-grid;place-items:center;flex:none;width:20px;height:20px;margin:0;padding:0;border:0!important;border-radius:50%!important;background:transparent!important;color:inherit!important;cursor:pointer;box-shadow:none!important}
body.brand-page.account-page #dashboard .ui-tagbox-x:hover{background:var(--ui-accent-line)!important}
body.brand-page.account-page #dashboard .ui-tagbox-input{flex:1 1 140px;min-width:120px;min-height:26px;margin:0;padding:2px 4px;border:0!important;border-radius:0!important;background:transparent!important;color:var(--ui-ink)!important;font:400 14px/1.4 var(--ui-font)!important;box-shadow:none!important;outline:none!important}
body.brand-page.account-page #dashboard .ui-tagbox-input:focus-visible{outline:none!important;background-color:transparent!important}
body.brand-page.account-page #dashboard .ui-tagbox-input::placeholder{color:var(--ui-faint);opacity:1}
/* Listbox: the suggestions of a combobox, under the relative box that holds its input (.ui-tagbox). The active option is
   aria-selected; the focus stays in the input. */
body.brand-page.account-page #dashboard .ui-listbox{position:absolute;top:calc(100% + 4px);right:-1px;left:-1px;z-index:30;display:grid;gap:2px;max-height:264px;margin:0;padding:4px;overflow:auto;overscroll-behavior:contain;list-style:none;border:1px solid var(--ui-line)!important;border-radius:8px!important;background:#fff!important;box-shadow:var(--ui-shadow-menu)!important}
body.brand-page.account-page #dashboard .ui-option{margin:0;padding:7px 10px;border-radius:6px;color:var(--ui-ink);font:400 13px/1.4 var(--ui-font);cursor:pointer}
body.brand-page.account-page #dashboard .ui-option:hover{background:var(--ui-hover)}
body.brand-page.account-page #dashboard .ui-option[aria-selected=true]{background:var(--ui-accent-soft);color:var(--ui-accent)}
body.brand-page.account-page #dashboard .ui-option.is-empty{background:transparent;color:var(--ui-muted);cursor:default}
/* A dialog's form error between its scrolling body and its foot, so it stays in view next to the buttons (= Lucru's
   .w-dialog-error). */
body.brand-page.account-page #dashboard .ui-dialog-error{flex:none;margin:0 20px 12px}
/* Reguli de lucru: the rule editor's foot holds up to four labelled buttons („Șterge regula…” of a saved rule, then
   Previzualizează, Renunță, Salvează regula); on a phone, where the foot's buttons share the width, they wrap onto a second
   row instead of losing a label. */
body.brand-page.account-page #dashboard #wrEditor .ui-dialog-foot{flex-wrap:wrap}
/* Reguli de lucru, the rules table: a row's two actions side by side, the hover „Editează…” then the pinned on/off at the right
   edge (the kit stacks a row's actions, which made every row three buttons tall), and the conditions on one line (the
   title tooltip and the editor have them whole), so a row keeps the kit's height. As cards (639px and narrower) the
   conditions wrap; „Termen” is a label/value line like the others (the generic card tier, §4.11). */
body.brand-page.account-page #dashboard #wrRules .ui-col-action>.ui-actions{flex-direction:row;align-items:center;justify-content:flex-end}
/* The order cell keeps its place number and its two arrows on one line: wrapped, the down arrow fell under the number and
   every row grew a line taller. */
body.brand-page.account-page #dashboard #wrRules td[data-label="Ordine"]>.ui-actions{flex-wrap:nowrap;gap:4px}
/* Reguli de lucru's two tables: a column without a kit width (Ordine; Rol, Deschise, Acceptă automat) takes only its content's
   width, so the main column, whose contained .ui-item asks for none, gets the rest, as in Lucru. Without this the table's
   auto layout handed the spare width to those columns and squeezed the rule's title onto two lines. */
body.brand-page.account-page #dashboard :is(#wrRules,#wrTeam) .ui-table thead th:is(:not([class]),.ui-col-num){width:1%;white-space:nowrap}
body.brand-page.account-page #dashboard #wrRules .wr-when{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
@container uitable (max-width:639px){
  body.brand-page.account-page #dashboard #wrRules .wr-when{display:block;-webkit-line-clamp:none;overflow:visible}
}
/* Preferințe de notificare, the staff "Lucru" block (notifications.js): its saved line keeps one line free and turns red when
   a save failed (moved here from work-rules.css). */
body.brand-page.account-page #dashboard #notificationSettings .work-preferences-state{min-height:1.45em}
body.brand-page.account-page #dashboard #notificationSettings .work-preferences-state[data-error=true]{color:var(--ui-danger-text)}
@media(max-width:767px){
  body.brand-page.account-page #dashboard .ui-tagbox{min-height:40px}
  body.brand-page.account-page #dashboard .ui-tagbox-input{font-size:16px!important}
}
@media(prefers-reduced-motion:reduce){
  body.brand-page.account-page #dashboard .ui-tagbox{transition:none!important}
}
@media(forced-colors:active){
  body.brand-page.account-page #dashboard .ui-option[aria-selected=true]{outline:2px solid Highlight}
}

/* The next-step box (next-step.js, PLAN-ergonomics A1): the step it performs sits under its text (a gate's section with the run's
   result first, the author's answer, the assistant's draft), then its buttons and the statement they carry. */
body.brand-page.account-page #dashboard .next-step-slot{display:grid;gap:12px;min-width:0;margin:6px 0 0}
body.brand-page.account-page #dashboard .next-step-slot>.ui-section.is-inset{padding-top:0;border-top:0}
body.brand-page.account-page #dashboard .next-step>.ui-hint{margin:0}
body.brand-page.account-page #dashboard .next-step>.ui-inline-error{margin:4px 0 0}
body.brand-page.account-page #dashboard .next-step-draft .ui-alert{margin:0}
/* The assistant's draft in the box on a phone (A7 QA at 390×844): one line per fact („Înregistrări citite: 4 înregistrări”), the start
   first and its two secondary acts side by side under it, so the start is a short scroll away. */
@media(max-width:600px){
  body.brand-page.account-page #dashboard .next-step-draft .ui-dl{display:grid;grid-template-columns:minmax(0,1fr);gap:4px}
  body.brand-page.account-page #dashboard .next-step-draft .ui-dl>div{display:block}
  body.brand-page.account-page #dashboard .next-step-draft .ui-dl :is(dt,dd){display:inline;margin:0}
  body.brand-page.account-page #dashboard .next-step-draft .ui-dl dt::after{content:": "}
  body.brand-page.account-page #dashboard .next-step[data-next-kind=draft] [data-next-actions]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  body.brand-page.account-page #dashboard .next-step[data-next-kind=draft] [data-next-actions]>.ui-btn{white-space:normal;padding:4px 10px}
  body.brand-page.account-page #dashboard .next-step[data-next-kind=draft] [data-next-actions]>.ui-btn-primary{grid-column:1/-1;order:-1}
}
body.brand-page.account-page #dashboard .manual-result{display:grid;gap:4px;min-width:0}
body.brand-page.account-page #dashboard .manual-metrics{margin:0;padding-left:18px;color:var(--ui-text);font-size:14px;line-height:1.55}
body.brand-page.account-page #dashboard .monitor-excerpt{margin:0}
/* „Monitorizare nouă” on a phone: the send stays in reach under the last field (A2.1). While it sticks to the bottom, the page keeps
   the bar's height (64px) and a margin free below a field that takes the focus, so the field never ends up under the bar (WCAG
   2.4.11). */
@media(max-width:600px){
  body.brand-page.account-page #dashboard #flowStartForm .flow-start-actions{position:sticky;bottom:0;z-index:5;padding:12px 0;background:#fff;box-shadow:0 -1px 0 var(--ui-line)}
  html:has(body.brand-page.account-page #dashboard #flowStartForm .flow-start-actions){scroll-padding-bottom:80px}
}
/* Notificări: „Rândul tău”, then „Noutăți” (A5.2). */
body.brand-page.account-page #dashboard .notification-group+.notification-group{margin-top:24px}
body.brand-page.account-page #dashboard .notification-group-title{margin:0 0 8px}
/* The author's next-step box reads as the tracking page (PLAN-public 4.5): the team's message as a quote, then „Ce ai de făcut”. */
body.brand-page.account-page #dashboard .next-step-message{display:grid;gap:2px;min-width:0;margin:4px 0 0;padding:6px 0 6px 12px;border-left:3px solid var(--ui-line-strong)}
body.brand-page.account-page #dashboard .next-step-message .ui-text{white-space:pre-wrap;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard .next-step-you{margin:2px 0 0}
/* The links a proposal's author sent, read-only beside the method's source (PLAN-public 4.7, C4). */
body.brand-page.account-page #dashboard .flow-sent-links{display:grid;gap:4px;margin:0;padding:0;list-style:none;font-size:13px;overflow-wrap:anywhere}
body.brand-page.account-page #dashboard #flowRhythmHint{color:var(--ui-warning-text,#93370d)}
body.brand-page.account-page #dashboard .case-links{display:grid;gap:4px;margin:0;padding:0;list-style:none;overflow-wrap:anywhere}