@jirawatpyk/aura-react 5.39.0 → 5.41.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/README.md +15 -0
  2. package/dist/aura.bundle.js +11 -0
  3. package/dist/cjs/index.cjs +11 -0
  4. package/dist/esm/AppShell.js +1 -0
  5. package/dist/esm/Menu.js +4 -1
  6. package/dist/esm/PageHeader.js +4 -0
  7. package/dist/esm/strings.js +1 -0
  8. package/dist/esm/strings.sv.js +1 -0
  9. package/dist/esm/strings.th.js +1 -0
  10. package/dist/index.d.cts +6 -0
  11. package/dist/index.d.ts +6 -0
  12. package/dist/locales/sv.cjs +1 -0
  13. package/dist/locales/sv.d.cts +2 -0
  14. package/dist/locales/sv.d.ts +2 -0
  15. package/dist/locales/th.cjs +1 -0
  16. package/dist/locales/th.d.cts +2 -0
  17. package/dist/locales/th.d.ts +2 -0
  18. package/dist/server/index.cjs +7 -0
  19. package/dist/server/index.d.cts +6 -0
  20. package/dist/server/index.d.ts +6 -0
  21. package/dist/server/index.js +7 -0
  22. package/dist/styles.css +162 -144
  23. package/dist/styles.layer.css +162 -144
  24. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -13,7 +13,7 @@
13
13
  background: transparent;
14
14
  color: inherit;
15
15
  font-family: var(--font-sans); /* 5.30: not inherit — a trigger outside a styled root fell back to Arial */
16
- font-size: 13px;
16
+ font-size: max(13px, .8125rem);
17
17
  font-weight: 500;
18
18
  line-height: 1;
19
19
  display: inline-flex;
@@ -70,10 +70,10 @@ button.aura-btn--creative[aria-disabled='true']:hover { box-shadow: var(--aura-s
70
70
  .aura-btn--primary:hover { background: var(--aura-button-primary-bg-hover); }
71
71
 
72
72
  .aura-btn--secondary { border: 1px solid var(--aura-button-secondary-border); color: var(--aura-fg-primary); }
73
- .aura-btn--secondary:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
73
+ .aura-btn--secondary:hover, .aura-btn--secondary[aria-haspopup][aria-expanded="true"] { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
74
74
  /* Destructive: filled for the confirm step, outline beside other actions. Loading keeps the colour (busy, not unavailable). */
75
75
  .aura-btn--ghost { color: var(--aura-fg-primary); }
76
- .aura-btn--ghost:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
76
+ .aura-btn--ghost:hover, .aura-btn--ghost[aria-haspopup][aria-expanded="true"] { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
77
77
  /* size="sm" (4.16): 32px for toolbars, table rows and card footers. On touch the pill stays 32px and a transparent
78
78
  * ::after grows the hit area to 44px, as IconButton does. */
79
79
  .aura-btn--sm { height: var(--aura-button-height-sm); padding: 0 var(--aura-space-3); gap: 6px; }
@@ -118,14 +118,14 @@ button.aura-btn--creative[aria-disabled='true']:hover { box-shadow: var(--aura-s
118
118
  display: flex; height: var(--aura-table-row-height); min-width: var(--aura-row-min, 0);
119
119
  background: var(--aura-table-head-bg);
120
120
  border-bottom: 1px solid var(--aura-border-default);
121
- font-family: var(--font-mono); font-size: 12px; color: var(--aura-fg-secondary);
121
+ font-family: var(--font-mono); font-size: max(12px, .75rem); color: var(--aura-fg-secondary);
122
122
  }
123
123
  .aura-table__row {
124
124
  box-sizing: border-box; display: flex; height: var(--aura-table-row-height); /* exactly the virtual row height */
125
125
  min-width: var(--aura-row-min, 0);
126
126
  background: var(--aura-bg-surface);
127
127
  border-bottom: 1px solid var(--aura-border-default);
128
- font-size: 13px;
128
+ font-size: max(13px, .8125rem);
129
129
  }
130
130
  .aura-table__row:last-child { border-bottom: 0; }
131
131
  .aura-table__row:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
@@ -183,7 +183,7 @@ button.aura-btn--creative[aria-disabled='true']:hover { box-shadow: var(--aura-s
183
183
  .aura-table__row--auto { height: auto; min-height: var(--aura-table-row-height); }
184
184
  .aura-table__td--auto {
185
185
  --aura-cell-pad-y: clamp(0px, calc((var(--aura-table-row-height) - 1px - var(--aura-button-height-sm)) / 2), var(--aura-space-2));
186
- display: flex; align-items: center; height: auto; line-height: 20px; white-space: normal;
186
+ display: flex; align-items: center; height: auto; line-height: max(20px, 1.25rem); white-space: normal;
187
187
  padding-top: var(--aura-cell-pad-y); padding-bottom: var(--aura-cell-pad-y);
188
188
  }
189
189
  .aura-table__cell { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; }
@@ -281,7 +281,7 @@ button.aura-btn--creative[aria-disabled='true']:hover { box-shadow: var(--aura-s
281
281
  background: var(--aura-bg-surface); color: var(--aura-fg-primary);
282
282
  border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-md);
283
283
  box-shadow: var(--aura-shadow-enterprise);
284
- font-family: var(--font-sans); font-size: 13px;
284
+ font-family: var(--font-sans); font-size: max(13px, .8125rem);
285
285
  }
286
286
  .aura-menu__item {
287
287
  display: flex; align-items: center; gap: var(--aura-space-2); width: 100%;
@@ -319,19 +319,19 @@ a.aura-menu__item { text-decoration: none; box-sizing: border-box; }
319
319
  .aura-menu__radio.is-on { border-color: var(--aura-control-checked-bg); }
320
320
  .aura-menu__radio.is-on::after { content: ''; width: 8px; height: 8px; border-radius: var(--aura-radius-full); background: var(--aura-control-checked-bg); }
321
321
  /* 5.7: a header above the items (who is signed in), set off by a hairline like a separator. */
322
- .aura-menu__header { margin: calc(-1 * var(--aura-space-1)) calc(-1 * var(--aura-space-1)) var(--aura-space-1); padding: var(--aura-space-3); border-bottom: 1px solid var(--aura-border-default); color: var(--aura-fg-secondary); font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
322
+ .aura-menu__header { margin: calc(-1 * var(--aura-space-1)) calc(-1 * var(--aura-space-1)) var(--aura-space-1); padding: var(--aura-space-3); border-bottom: 1px solid var(--aura-border-default); color: var(--aura-fg-secondary); font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); overflow-wrap: anywhere; }
323
323
  .aura-menu__header > * { margin: 0; }
324
324
  /* Stays in view when a long menu scrolls. */
325
325
  .aura-menu.has-header .aura-menu__header { position: sticky; top: calc(-1 * var(--aura-space-1)); z-index: 1; background: var(--aura-bg-surface); }
326
- .aura-menu__header strong, .aura-menu__header b { color: var(--aura-fg-primary); font-weight: 500; font-size: 13px; }
326
+ .aura-menu__header strong, .aura-menu__header b { color: var(--aura-fg-primary); font-weight: 500; font-size: max(13px, .8125rem); }
327
327
  .aura-menu__sep { height: 1px; margin: var(--aura-space-1) calc(-1 * var(--aura-space-1)); background: var(--aura-border-default); }
328
328
 
329
329
  /* Footer + pager */
330
330
  .aura-table__foot {
331
- height: var(--aura-table-row-height); display: flex; align-items: center; justify-content: space-between;
331
+ min-height: var(--aura-table-row-height); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; column-gap: var(--aura-space-3); /* 5.40: grows and wraps with a larger default font */
332
332
  padding: 0 var(--aura-space-3) 0 var(--aura-space-6);
333
333
  border-top: 1px solid var(--aura-border-default); background: var(--aura-bg-surface);
334
- font-size: 13px; color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums;
334
+ font-size: max(13px, .8125rem); color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums;
335
335
  }
336
336
  .aura-table__pager { display: inline-flex; align-items: center; gap: var(--aura-space-1); }
337
337
  .aura-table__pager > span { margin-right: var(--aura-space-2); }
@@ -344,7 +344,7 @@ a.aura-icon-btn { text-decoration: none; }
344
344
  border: 0; border-radius: var(--aura-radius-full); background: transparent; color: var(--aura-fg-primary);
345
345
  cursor: pointer; transition: background var(--aura-duration-fast) var(--aura-ease);
346
346
  }
347
- .aura-icon-btn:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
347
+ .aura-icon-btn:hover, .aura-icon-btn[aria-haspopup][aria-expanded="true"] { background: var(--aura-hover, var(--aura-bg-surface-hover)); } /* 5.41 (DxT #22): looks open while its menu shows */
348
348
  .aura-icon-btn--danger { color: var(--aura-fg-danger); }
349
349
  .aura-icon-btn--danger:hover { background: var(--aura-alert-danger-bg); }
350
350
  .aura-icon-btn:disabled { opacity: var(--aura-disabled-opacity); pointer-events: none; }
@@ -398,8 +398,8 @@ a.aura-icon-btn { text-decoration: none; }
398
398
  border-radius: var(--aura-radius-full); background: var(--aura-bg-canvas); color: var(--aura-fg-secondary);
399
399
  margin-bottom: var(--aura-space-4);
400
400
  }
401
- .aura-table__empty-title { margin: 0; font-size: 14px; font-weight: 600; color: var(--aura-fg-primary); }
402
- .aura-table__empty-text { margin: var(--aura-space-1) 0 0; font-size: 13px; line-height: 1.7; color: var(--aura-fg-secondary); }
401
+ .aura-table__empty-title { margin: 0; font-size: max(14px, .875rem); font-weight: 600; color: var(--aura-fg-primary); }
402
+ .aura-table__empty-text { margin: var(--aura-space-1) 0 0; font-size: max(13px, .8125rem); line-height: 1.7; color: var(--aura-fg-secondary); }
403
403
  .aura-table__empty-action { margin-top: var(--aura-space-6); }
404
404
 
405
405
  /* Checkbox — 16px, 4px corners, ink when checked */
@@ -429,9 +429,9 @@ a.aura-icon-btn { text-decoration: none; }
429
429
  max-width: 100%;
430
430
  border-radius: var(--aura-radius-full);
431
431
  padding: 2px var(--aura-space-2) 2px 6px;
432
- font-size: 11px;
432
+ font-size: max(11px, .6875rem);
433
433
  font-weight: 500; /* 5.30 (Chamber-OS 137): medium everywhere, not the parent's weight; Badge stays 600 */
434
- line-height: 16px;
434
+ line-height: max(16px, 1rem);
435
435
  white-space: nowrap;
436
436
  background: var(--aura-status-neutral-bg);
437
437
  color: var(--aura-status-neutral-fg);
@@ -487,14 +487,14 @@ a.aura-icon-btn { text-decoration: none; }
487
487
 
488
488
  /* ---------- Forms ---------- */
489
489
  .aura-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; font-family: var(--font-sans); }
490
- .aura-field__label { padding: 0; font-size: 13px; line-height: 1.4; font-weight: 500; color: var(--aura-fg-primary); }
490
+ .aura-field__label { padding: 0; font-size: max(13px, .8125rem); line-height: 1.4; font-weight: 500; color: var(--aura-fg-primary); }
491
491
  .aura-field__req { color: var(--aura-fg-danger); }
492
492
  .aura-field__opt { font-weight: 400; color: var(--aura-fg-tertiary); }
493
- .aura-field__hint, .aura-field__error { display: flex; align-items: flex-start; gap: var(--aura-space-1); margin: 0; font-size: 12px; line-height: 1.5; color: var(--aura-fg-secondary); }
493
+ .aura-field__hint, .aura-field__error { display: flex; align-items: flex-start; gap: var(--aura-space-1); margin: 0; font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
494
494
  .aura-field__error { color: var(--aura-fg-danger); }
495
495
  .aura-field__error .aura-icon { margin-top: 2px; }
496
496
  /* 5.31 (Chamber-OS addendum 41): TextField/Textarea `labelAddon`, between the label and the box, in the field's gap. */
497
- .aura-field__addon { min-width: 0; font-size: 13px; line-height: 1.5; color: var(--aura-fg-primary); }
497
+ .aura-field__addon { min-width: 0; font-size: max(13px, .8125rem); line-height: 1.5; color: var(--aura-fg-primary); }
498
498
  .aura-field.is-disabled .aura-field__label { color: var(--aura-fg-secondary); }
499
499
 
500
500
  .aura-input {
@@ -517,7 +517,7 @@ a.aura-icon-btn { text-decoration: none; }
517
517
  .aura-input__control::placeholder, .aura-textarea::placeholder { color: var(--aura-fg-tertiary); opacity: 1; }
518
518
  .aura-input.has-icon .aura-input__control { padding-left: calc(var(--aura-space-3) + var(--aura-icon-sm) + var(--aura-space-2)); }
519
519
  .aura-input__icon { position: absolute; left: var(--aura-space-3); color: var(--aura-fg-secondary); pointer-events: none; }
520
- .aura-input__suffix { padding: 0 var(--aura-space-3) 0 0; color: var(--aura-fg-secondary); font-size: 13px; white-space: nowrap; }
520
+ .aura-input__suffix { padding: 0 var(--aura-space-3) 0 0; color: var(--aura-fg-secondary); font-size: max(13px, .8125rem); white-space: nowrap; }
521
521
  .aura-field.is-invalid .aura-input, .aura-field.is-invalid .aura-textarea { border-color: var(--aura-border-danger); }
522
522
  .aura-field.is-disabled .aura-input { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); }
523
523
  .aura-field.is-disabled .aura-input__control { cursor: not-allowed; }
@@ -542,7 +542,7 @@ a.aura-icon-btn { text-decoration: none; }
542
542
  .aura-select__trigger:disabled { cursor: not-allowed; }
543
543
  .aura-select__value { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
544
544
  .aura-select__value.is-placeholder { color: var(--aura-fg-tertiary); }
545
- .aura-select__group { padding: var(--aura-space-2) var(--aura-space-2) var(--aura-space-1); font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--aura-fg-tertiary); }
545
+ .aura-select__group { padding: var(--aura-space-2) var(--aura-space-2) var(--aura-space-1); font-family: var(--font-mono); font-size: max(11px, .6875rem); text-transform: uppercase; letter-spacing: 0.04em; color: var(--aura-fg-tertiary); }
546
546
  .aura-select.is-open .aura-select__chevron { transform: rotate(180deg); }
547
547
  /* 5.19 (Chamber-OS 114): a read-only Select looks like a read-only TextField — the same ground, no chevron (it doesn't
548
548
  * open), no pointer; the value keeps full contrast. */
@@ -552,11 +552,11 @@ a.aura-icon-btn { text-decoration: none; }
552
552
  .aura-radio-group > legend { margin-bottom: 6px; }
553
553
  .aura-radio-group__list { display: flex; flex-direction: column; gap: var(--aura-space-3); }
554
554
  .aura-radio-group__list.is-horizontal { flex-direction: row; flex-wrap: wrap; gap: var(--aura-space-3) var(--aura-space-6); }
555
- .aura-choice { display: flex; align-items: flex-start; gap: var(--aura-space-2); cursor: pointer; font-size: 14px; color: var(--aura-fg-primary); }
555
+ .aura-choice { display: flex; align-items: flex-start; gap: var(--aura-space-2); cursor: pointer; font-size: max(14px, .875rem); color: var(--aura-fg-primary); }
556
556
  .aura-choice.is-disabled { opacity: var(--aura-disabled-opacity); cursor: not-allowed; }
557
557
  .aura-choice__text { display: flex; flex-direction: column; gap: 2px; }
558
- .aura-choice__label { font-size: 14px; line-height: 20px; color: var(--aura-fg-primary); cursor: inherit; }
559
- .aura-choice__desc { font-size: 12px; line-height: 1.5; color: var(--aura-fg-secondary); }
558
+ .aura-choice__label { font-size: max(14px, .875rem); line-height: max(20px, 1.25rem); color: var(--aura-fg-primary); cursor: inherit; }
559
+ .aura-choice__desc { font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
560
560
  .aura-radio {
561
561
  appearance: none; -webkit-appearance: none; flex: none; margin: 2px 0 0; box-sizing: border-box;
562
562
  width: var(--aura-icon-sm); height: var(--aura-icon-sm); border-radius: var(--aura-radius-full);
@@ -599,11 +599,11 @@ a.aura-icon-btn { text-decoration: none; }
599
599
  .aura-alert {
600
600
  display: flex; align-items: flex-start; gap: var(--aura-space-3); padding: var(--aura-space-4);
601
601
  border: 1px solid var(--aura-alert-info-border); border-radius: var(--aura-radius-lg);
602
- background: var(--aura-alert-info-bg); color: var(--aura-fg-primary); font-family: var(--font-sans); font-size: 14px;
602
+ background: var(--aura-alert-info-bg); color: var(--aura-fg-primary); font-family: var(--font-sans); font-size: max(14px, .875rem);
603
603
  }
604
604
  .aura-alert__icon { margin-top: 2px; color: var(--aura-alert-info-fg); }
605
605
  .aura-alert__body { flex: 1; min-width: 0; }
606
- .aura-alert__title { margin: 0; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--aura-alert-info-fg); }
606
+ .aura-alert__title { margin: 0; font-size: max(14px, .875rem); font-weight: 600; line-height: max(20px, 1.25rem); color: var(--aura-alert-info-fg); }
607
607
  .aura-alert__text { margin-top: 2px; line-height: 1.6; }
608
608
  .aura-alert__title + .aura-alert__text { margin-top: var(--aura-space-1); }
609
609
  .aura-alert__text p { margin: 0; }
@@ -636,8 +636,8 @@ a.aura-icon-btn { text-decoration: none; }
636
636
  .aura-toast--warning .aura-toast__icon { color: var(--aura-alert-warning-fg); }
637
637
  .aura-toast--danger .aura-toast__icon { color: var(--aura-alert-danger-fg); }
638
638
  .aura-toast__body { flex: 1; min-width: 0; padding-top: 1px; }
639
- .aura-toast__title { margin: 0; font-size: 14px; font-weight: 500; line-height: 20px; }
640
- .aura-toast__text { margin: 2px 0 0; font-size: 13px; line-height: 1.5; color: var(--aura-fg-secondary); }
639
+ .aura-toast__title { margin: 0; font-size: max(14px, .875rem); font-weight: 500; line-height: max(20px, 1.25rem); }
640
+ .aura-toast__text { margin: 2px 0 0; font-size: max(13px, .8125rem); line-height: 1.5; color: var(--aura-fg-secondary); }
641
641
  .aura-toast__text > * { margin: 0; }
642
642
  .aura-toast__text a { color: var(--aura-fg-accent); text-underline-offset: 2px; }
643
643
  .aura-toast__text a:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 1px; border-radius: var(--aura-radius-xs); }
@@ -650,7 +650,7 @@ a.aura-icon-btn { text-decoration: none; }
650
650
  .aura-toast__action {
651
651
  flex: none; align-self: center; height: var(--aura-control-sm); padding: 0 var(--aura-space-2);
652
652
  border: 0; border-radius: var(--aura-radius-sm); background: transparent; color: var(--aura-fg-accent);
653
- font: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
653
+ font: inherit; font-size: max(13px, .8125rem); font-weight: 500; cursor: pointer;
654
654
  display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap;
655
655
  }
656
656
  /* Touch (5.6): the 32px action gets a 44px hit area, as IconButton does. Links in the text only get a little padding —
@@ -670,7 +670,7 @@ a.aura-icon-btn { text-decoration: none; }
670
670
  position: fixed; z-index: var(--aura-z-tooltip); max-width: var(--aura-tooltip-max);
671
671
  padding: 6px var(--aura-space-2); border-radius: var(--aura-radius-sm);
672
672
  background: var(--aura-bg-inverted); color: var(--aura-fg-inverted);
673
- font-family: var(--font-sans); font-size: 12px; line-height: 1.5; pointer-events: none;
673
+ font-family: var(--font-sans); font-size: max(12px, .75rem); line-height: 1.5; pointer-events: none;
674
674
  animation: aura-fade-in var(--aura-duration-fast) var(--aura-ease);
675
675
  }
676
676
  /* The Tooltip component's own tips can be hovered (WCAG 1.4.13, 5.1.1); rail labels and cell tips stay click-through. */
@@ -695,11 +695,11 @@ a.aura-icon-btn { text-decoration: none; }
695
695
  .aura-dialog--md { max-width: var(--aura-dialog-md); }
696
696
  .aura-dialog--lg { max-width: var(--aura-dialog-lg); }
697
697
  .aura-dialog__head { display: flex; align-items: flex-start; gap: var(--aura-space-3); }
698
- .aura-dialog__title { flex: 1; margin: 0; font-size: 16px; line-height: 1.5; font-weight: 600; }
698
+ .aura-dialog__title { flex: 1; margin: 0; font-size: max(16px, 1rem); line-height: 1.5; font-weight: 600; }
699
699
  .aura-dialog__close { margin: -6px -8px 0 0; }
700
- .aura-dialog__desc { margin: var(--aura-space-1) 0 0; font-size: 14px; line-height: 1.7; color: var(--aura-fg-secondary); }
700
+ .aura-dialog__desc { margin: var(--aura-space-1) 0 0; font-size: max(14px, .875rem); line-height: 1.7; color: var(--aura-fg-secondary); }
701
701
  /* Head and footer stay put; only the body scrolls (long forms keep their Save button in view). Side padding moves into the body so focus rings are not clipped. */
702
- .aura-dialog__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: var(--aura-space-4) calc(-1 * var(--aura-space-6)) 0; padding: var(--aura-space-1) var(--aura-space-6); font-size: 14px; line-height: 1.7; }
702
+ .aura-dialog__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: var(--aura-space-4) calc(-1 * var(--aura-space-6)) 0; padding: var(--aura-space-1) var(--aura-space-6); font-size: max(14px, .875rem); line-height: 1.7; }
703
703
  .aura-dialog__head, .aura-dialog__desc, .aura-dialog__foot { flex: none; }
704
704
  .aura-dialog__foot { margin-top: var(--aura-space-6); display: flex; justify-content: flex-end; flex-wrap: wrap; gap: var(--aura-space-3); }
705
705
  @media (prefers-reduced-motion: reduce) { .aura-dialog, .aura-scrim, .aura-toast, .aura-tooltip { animation: none; } }
@@ -709,7 +709,7 @@ a.aura-icon-btn { text-decoration: none; }
709
709
  box-sizing: border-box; display: flex; flex-direction: column; gap: var(--aura-space-4);
710
710
  padding: var(--aura-card-padding); background: var(--aura-bg-surface); color: var(--aura-fg-primary);
711
711
  border: 1px solid var(--aura-border-default); border-radius: var(--aura-card-radius); box-shadow: var(--aura-shadow-enterprise);
712
- font-family: var(--font-sans); font-size: 14px;
712
+ font-family: var(--font-sans); font-size: max(14px, .875rem);
713
713
  --aura-card-bleed: var(--aura-card-padding); /* 5.26: how far a bleeding table reaches out; 0 where the card is flush */
714
714
  }
715
715
  .aura-card.is-interactive { cursor: pointer; transition: border-color var(--aura-duration-fast) var(--aura-ease); }
@@ -741,9 +741,9 @@ a.aura-icon-btn { text-decoration: none; }
741
741
  .aura-card--creative { border: 2px solid var(--aura-border-strong); box-shadow: var(--aura-card-shadow-creative); }
742
742
  .aura-card__head { display: flex; align-items: flex-start; gap: var(--aura-space-3); }
743
743
  .aura-card__heading { flex: 1; min-width: 0; }
744
- .aura-card__title { margin: 0; font-size: 16px; line-height: 1.5; font-weight: 600; }
745
- .aura-card--creative .aura-card__title { font-family: var(--font-display); font-size: 24px; line-height: 1.2; }
746
- .aura-card__desc { margin: 2px 0 0; font-size: 13px; line-height: 1.5; color: var(--aura-fg-secondary); }
744
+ .aura-card__title { margin: 0; font-size: max(16px, 1rem); line-height: 1.5; font-weight: 600; }
745
+ .aura-card--creative .aura-card__title { font-family: var(--font-display); font-size: max(24px, 1.5rem); line-height: 1.2; }
746
+ .aura-card__desc { margin: 2px 0 0; font-size: max(13px, .8125rem); line-height: 1.5; color: var(--aura-fg-secondary); }
747
747
  .aura-card__actions { display: flex; gap: var(--aura-space-2); margin: -4px -8px 0 0; }
748
748
  .aura-card__body { line-height: 1.7; }
749
749
  .aura-card__foot { display: flex; justify-content: flex-end; gap: var(--aura-space-3); padding-top: var(--aura-space-4); border-top: 1px solid var(--aura-border-subtle); }
@@ -759,7 +759,7 @@ a.aura-icon-btn { text-decoration: none; }
759
759
  box-sizing: border-box; /* 5.39: a link tab (<a>) was 2px taller than a button tab — its underline sat outside the height */
760
760
  height: var(--aura-input-height); padding: 0;
761
761
  border: 0; border-bottom: 2px solid transparent; background: transparent;
762
- color: var(--aura-fg-secondary); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
762
+ color: var(--aura-fg-secondary); font: inherit; font-size: max(13px, .8125rem); font-weight: 500; cursor: pointer;
763
763
  transition: color var(--aura-duration-fast) var(--aura-ease), border-color var(--aura-duration-fast) var(--aura-ease);
764
764
  }
765
765
  .aura-tab:hover { color: var(--aura-fg-primary); }
@@ -770,7 +770,7 @@ a.aura-tab { text-decoration: none; }
770
770
  .aura-tab__count {
771
771
  min-width: 18px; padding: 0 6px; box-sizing: border-box; border-radius: var(--aura-radius-full);
772
772
  background: var(--aura-status-neutral-bg); color: var(--aura-status-neutral-fg);
773
- font-size: 11px; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums;
773
+ font-size: max(11px, .6875rem); line-height: max(18px, 1.125rem); text-align: center; font-variant-numeric: tabular-nums;
774
774
  }
775
775
  .aura-tabs__panel { padding-top: var(--aura-space-6); outline: none; }
776
776
  /* 5.39 (Chamber-OS 143): touchHeight — 44px tabs (underline or segmented, buttons or links) below 640px or on a coarse
@@ -796,12 +796,12 @@ a.aura-tab { text-decoration: none; }
796
796
  .aura-nav > .aura-nav__scroll:first-child { padding-top: var(--aura-space-3); }
797
797
  .aura-nav--borderless { border-right: 0; }
798
798
  .aura-nav__section + .aura-nav__section { margin-top: var(--aura-space-5); }
799
- .aura-nav__title { margin: 0 0 var(--aura-space-1); padding: 0 var(--aura-space-3); font-family: var(--font-mono); font-size: 11px; line-height: 20px; color: var(--aura-fg-tertiary); text-transform: uppercase; letter-spacing: 0.04em; }
799
+ .aura-nav__title { margin: 0 0 var(--aura-space-1); padding: 0 var(--aura-space-3); font-family: var(--font-mono); font-size: max(11px, .6875rem); line-height: max(20px, 1.25rem); color: var(--aura-fg-tertiary); text-transform: uppercase; letter-spacing: 0.04em; }
800
800
  .aura-nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
801
801
  .aura-nav__item {
802
802
  box-sizing: border-box; display: flex; align-items: center; gap: var(--aura-space-3); width: 100%;
803
803
  min-height: 36px; padding: var(--aura-space-1) var(--aura-space-3); border: 0; border-radius: var(--aura-radius-sm);
804
- background: transparent; color: var(--aura-fg-secondary); font: inherit; font-size: 13px; font-weight: 500;
804
+ background: transparent; color: var(--aura-fg-secondary); font: inherit; font-size: max(13px, .8125rem); font-weight: 500;
805
805
  text-decoration: none; text-align: left; cursor: pointer;
806
806
  transition: background var(--aura-duration-fast) var(--aura-ease), color var(--aura-duration-fast) var(--aura-ease);
807
807
  }
@@ -827,10 +827,10 @@ a.aura-tab { text-decoration: none; }
827
827
  * ("Marknadsförings-" / "målgrupp"); breaking anywhere is only the last resort. Only words of 12+ letters hyphenate,
828
828
  * with 5+ on each side, so ordinary English labels keep wrapping between words. */
829
829
  .aura-nav__label {
830
- flex: 1; min-width: 0; line-height: 18px; overflow: hidden; overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 12 5 5;
830
+ flex: 1; min-width: 0; line-height: max(18px, 1.125rem); overflow: hidden; overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 12 5 5;
831
831
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
832
832
  }
833
- .aura-nav__count { font-size: 11px; font-variant-numeric: tabular-nums; color: var(--aura-fg-secondary); }
833
+ .aura-nav__count { font-size: max(11px, .6875rem); font-variant-numeric: tabular-nums; color: var(--aura-fg-secondary); }
834
834
  .aura-nav__badge { display: inline-flex; align-items: center; flex: none; }
835
835
  /* Groups: a disclosure button, its items indented one step per level. */
836
836
  .aura-nav__item { padding-left: calc(var(--aura-space-3) + var(--aura-nav-depth, 0) * (var(--aura-icon-sm) + var(--aura-space-3))); }
@@ -860,7 +860,7 @@ a.aura-tab { text-decoration: none; }
860
860
  .aura-nav--collapsed .aura-nav__item--group.has-active .aura-icon { color: var(--aura-fg-accent); }
861
861
  .aura-nav__initial {
862
862
  display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: var(--aura-radius-sm);
863
- background: var(--aura-status-neutral-bg); color: var(--aura-status-neutral-fg); font-size: 12px; font-weight: 600; text-transform: uppercase;
863
+ background: var(--aura-status-neutral-bg); color: var(--aura-status-neutral-fg); font-size: max(12px, .75rem); font-weight: 600; text-transform: uppercase;
864
864
  }
865
865
  .aura-nav__dot {
866
866
  position: absolute; top: 6px; left: calc(50% + 5px); width: 8px; height: 8px; border-radius: var(--aura-radius-full);
@@ -870,7 +870,7 @@ a.aura-tab { text-decoration: none; }
870
870
  @media (prefers-reduced-motion: reduce) { .aura-nav { transition: none; } }
871
871
 
872
872
  /* ---------- Breadcrumb ---------- */
873
- .aura-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); list-style: none; margin: 0; padding: 0; font-family: var(--font-sans); font-size: 13px; }
873
+ .aura-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); list-style: none; margin: 0; padding: 0; font-family: var(--font-sans); font-size: max(13px, .8125rem); }
874
874
  .aura-crumbs li { display: inline-flex; align-items: center; gap: var(--aura-space-2); }
875
875
  .aura-crumbs a, .aura-crumbs button {
876
876
  padding: 0; border: 0; background: none; font: inherit; color: var(--aura-fg-secondary); text-decoration: none; cursor: pointer; border-radius: var(--aura-radius-xs);
@@ -910,6 +910,7 @@ a.aura-tab { text-decoration: none; }
910
910
  background: var(--aura-status-neutral-bg); color: var(--aura-status-neutral-fg);
911
911
  }
912
912
  .aura-avatar img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
913
+ /* Initials keep px: they are sized to the circle, and the name is the accessible name (5.40). */
913
914
  .aura-avatar--sm { width: var(--aura-avatar-sm); height: var(--aura-avatar-sm); font-size: 10px; }
914
915
  .aura-avatar--md { width: var(--aura-avatar-md); height: var(--aura-avatar-md); font-size: 12px; }
915
916
  .aura-avatar--lg { width: var(--aura-avatar-lg); height: var(--aura-avatar-lg); font-size: 14px; }
@@ -941,7 +942,7 @@ a.aura-tab { text-decoration: none; }
941
942
  position: fixed; z-index: var(--aura-z-menu); box-sizing: border-box; overflow-y: auto; overscroll-behavior: contain;
942
943
  background: var(--aura-bg-surface); color: var(--aura-fg-primary);
943
944
  border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-md); box-shadow: var(--aura-shadow-overlay);
944
- font-family: var(--font-sans); font-size: 14px;
945
+ font-family: var(--font-sans); font-size: max(14px, .875rem);
945
946
  }
946
947
  .aura-combo__list { list-style: none; margin: 0; padding: var(--aura-space-1); }
947
948
  .aura-combo__option {
@@ -954,15 +955,15 @@ a.aura-tab { text-decoration: none; }
954
955
  .aura-combo__option.is-disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
955
956
  .aura-combo__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
956
957
  .aura-combo__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
957
- .aura-combo__desc { font-size: 12px; line-height: 1.5; color: var(--aura-fg-secondary); }
958
+ .aura-combo__desc { font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
958
959
  /* Same specificity as `.aura-combo__option > .aura-icon` above and later in the file, so it wins by order (4.18). */
959
960
  .aura-combo__option > .aura-combo__check { color: var(--aura-fg-accent); }
960
961
  /* 5.16 (Chamber-OS 105): option groups under a heading. */
961
962
  .aura-combo__group { list-style: none; }
962
963
  .aura-combo__group + .aura-combo__group, .aura-combo__option + .aura-combo__group { margin-top: var(--aura-space-1); padding-top: var(--aura-space-1); border-top: 1px solid var(--aura-border-subtle); }
963
- .aura-combo__group-label { display: block; padding: var(--aura-space-2) var(--aura-space-2) var(--aura-space-1); font-family: var(--font-mono); font-size: 11px; line-height: 16px; color: var(--aura-fg-secondary); text-transform: uppercase; letter-spacing: 0.04em; }
964
+ .aura-combo__group-label { display: block; padding: var(--aura-space-2) var(--aura-space-2) var(--aura-space-1); font-family: var(--font-mono); font-size: max(11px, .6875rem); line-height: max(16px, 1rem); color: var(--aura-fg-secondary); text-transform: uppercase; letter-spacing: 0.04em; }
964
965
  .aura-combo__grouplist { list-style: none; margin: 0; padding: 0; }
965
- .aura-combo__note { display: flex; align-items: center; gap: var(--aura-space-2); padding: var(--aura-space-3) var(--aura-space-2); font-size: 13px; color: var(--aura-fg-secondary); }
966
+ .aura-combo__note { display: flex; align-items: center; gap: var(--aura-space-2); padding: var(--aura-space-3) var(--aura-space-2); font-size: max(13px, .8125rem); color: var(--aura-fg-secondary); }
966
967
 
967
968
  /* ---------- DatePicker / Calendar ---------- */
968
969
  .aura-date .aura-input__control { padding-right: calc(var(--aura-space-2) + 2 * var(--aura-control-sm)); font-variant-numeric: tabular-nums; }
@@ -975,21 +976,21 @@ a.aura-tab { text-decoration: none; }
975
976
  font-family: var(--font-sans);
976
977
  }
977
978
  .aura-cal { width: calc(7 * var(--aura-cal-cell)); }
978
- .aura-cal__hint { margin: 0 0 var(--aura-space-2); font-size: 12px; color: var(--aura-fg-secondary); text-align: center; }
979
+ .aura-cal__hint { margin: 0 0 var(--aura-space-2); font-size: max(12px, .75rem); color: var(--aura-fg-secondary); text-align: center; }
979
980
  .aura-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--aura-space-2); }
980
981
  .aura-cal__title {
981
- display: inline-flex; align-items: center; gap: var(--aura-space-1); height: var(--aura-control-sm); padding: 0 var(--aura-space-2);
982
+ display: inline-flex; align-items: center; gap: var(--aura-space-1); min-height: var(--aura-control-sm); padding: 0 var(--aura-space-2);
982
983
  border: 0; border-radius: var(--aura-radius-sm); background: transparent; color: var(--aura-fg-primary);
983
- font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
984
+ font: inherit; font-size: max(14px, .875rem); font-weight: 600; cursor: pointer;
984
985
  }
985
986
  .aura-cal__title:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
986
987
  .aura-cal__title:focus-visible, .aura-cal__link:focus-visible, .aura-cal__year:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 0; }
987
988
  .aura-cal__grid { border-collapse: separate; border-spacing: 0 2px; width: 100%; }
988
- .aura-cal__grid th { height: 28px; padding: 0; font-size: 12px; font-weight: 500; color: var(--aura-fg-secondary); }
989
+ .aura-cal__grid th { height: 28px; padding: 0; font-size: max(12px, .75rem); font-weight: 500; color: var(--aura-fg-secondary); }
989
990
  .aura-cal__grid td { padding: 0; text-align: center; }
990
991
  .aura-cal__day {
991
992
  width: var(--aura-cal-cell); height: var(--aura-cal-cell); padding: 0; border: 0; border-radius: var(--aura-radius-full);
992
- background: transparent; color: var(--aura-fg-primary); font: inherit; font-size: 13px; font-variant-numeric: tabular-nums; cursor: pointer;
993
+ background: transparent; color: var(--aura-fg-primary); font: inherit; font-size: max(13px, .8125rem); font-variant-numeric: tabular-nums; cursor: pointer;
993
994
  }
994
995
  .aura-cal__day:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
995
996
  .aura-cal__day.is-outside { color: var(--aura-fg-tertiary); }
@@ -1004,14 +1005,14 @@ a.aura-tab { text-decoration: none; }
1004
1005
  .aura-cal__years { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--aura-space-1); }
1005
1006
  .aura-cal__year {
1006
1007
  height: 40px; border: 0; border-radius: var(--aura-radius-sm); background: transparent; color: var(--aura-fg-primary);
1007
- font: inherit; font-size: 13px; font-variant-numeric: tabular-nums; cursor: pointer;
1008
+ font: inherit; font-size: max(13px, .8125rem); font-variant-numeric: tabular-nums; cursor: pointer;
1008
1009
  }
1009
1010
  .aura-cal__year:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
1010
1011
  .aura-cal__year.is-selected { background: var(--aura-control-checked-bg); color: var(--aura-control-checked-fg); }
1011
1012
  .aura-cal__foot { display: flex; justify-content: space-between; margin-top: var(--aura-space-2); padding-top: var(--aura-space-2); border-top: 1px solid var(--aura-border-subtle); }
1012
1013
  .aura-cal__link {
1013
1014
  height: var(--aura-control-sm); padding: 0 var(--aura-space-2); border: 0; border-radius: var(--aura-radius-sm);
1014
- background: transparent; color: var(--aura-fg-accent); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
1015
+ background: transparent; color: var(--aura-fg-accent); font: inherit; font-size: max(13px, .8125rem); font-weight: 500; cursor: pointer;
1015
1016
  }
1016
1017
  .aura-cal__link:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
1017
1018
  .aura-cal__link:disabled { opacity: var(--aura-disabled-opacity); cursor: not-allowed; }
@@ -1034,10 +1035,10 @@ a.aura-tab { text-decoration: none; }
1034
1035
  .aura-drawer--nav { max-width: var(--aura-sidenav-width); }
1035
1036
  .aura-drawer__head { display: flex; align-items: center; gap: var(--aura-space-3); padding: var(--aura-space-4) var(--aura-space-4) var(--aura-space-2) var(--aura-space-6); }
1036
1037
  .aura-drawer--nav .aura-drawer__head { position: absolute; top: var(--aura-space-2); inset-inline-end: var(--aura-space-2); padding: 0; z-index: 1; } /* 5.32: inline-end, so RTL puts it on the left with the header's room */
1037
- .aura-drawer__title { flex: 1; margin: 0; font-size: 16px; line-height: 1.5; font-weight: 600; }
1038
- .aura-drawer__desc { margin: 0; padding: 0 var(--aura-space-6); font-size: 14px; line-height: 1.7; color: var(--aura-fg-secondary); }
1038
+ .aura-drawer__title { flex: 1; margin: 0; font-size: max(16px, 1rem); line-height: 1.5; font-weight: 600; }
1039
+ .aura-drawer__desc { margin: 0; padding: 0 var(--aura-space-6); font-size: max(14px, .875rem); line-height: 1.7; color: var(--aura-fg-secondary); }
1039
1040
  .aura-drawer__body {
1040
- flex: 1; overflow-y: auto; padding: var(--aura-space-4) var(--aura-space-6); font-size: 14px; line-height: 1.7;
1041
+ flex: 1; overflow-y: auto; padding: var(--aura-space-4) var(--aura-space-6); font-size: max(14px, .875rem); line-height: 1.7;
1041
1042
  /* 5.14 (Chamber-OS 91): a field scrolled into view (focus, the phone keyboard) keeps clear of the head and foot. */
1042
1043
  scroll-padding-block: var(--aura-space-4);
1043
1044
  }
@@ -1123,6 +1124,9 @@ a.aura-tab { text-decoration: none; }
1123
1124
  .aura-shell__bar--menu-only { display: none; }
1124
1125
  }
1125
1126
  .aura-shell__bar-content { flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--aura-space-3); }
1127
+ /* 5.41 (DxT Monitor #19): a page with its own back arrow marks itself with data-aura-hide-menubutton (on any element)
1128
+ * and the bar drops the menu button, as BottomNav does for data-aura-hide-bottomnav. */
1129
+ :root:has([data-aura-hide-menubutton]) :is(.aura-shell__menu, .aura-shell__bar--no-header) { display: none; } /* with no header the bar would be empty */
1126
1130
  .aura-shell__content { flex: 1; min-width: 0; padding: var(--aura-space-6) var(--aura-space-4); }
1127
1131
  /* 5.7: <main> takes focus (tabIndex -1) for skip links and "the row you acted on is gone"; a landmark gets no ring. */
1128
1132
  .aura-shell__content:focus { outline: none; }
@@ -1138,11 +1142,25 @@ a.aura-tab { text-decoration: none; }
1138
1142
  * 28px and the actions wrap under the text. */
1139
1143
  .aura-page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--aura-space-4) var(--aura-space-6); min-width: 0; font-family: var(--font-sans); }
1140
1144
  .aura-page-header__text { display: flex; flex-direction: column; gap: var(--aura-space-1); flex: 1 1 320px; min-width: 0; }
1141
- .aura-page-header__eyebrow { margin: 0; font-family: var(--font-mono); font-size: 12px; line-height: 1.7; color: var(--aura-fg-secondary); overflow-wrap: anywhere; }
1142
- .aura-page-header__title { margin: 0; font-family: var(--font-display); font-size: 28px; line-height: 1.15; font-weight: 600; letter-spacing: -0.01em; color: var(--aura-fg-primary); overflow-wrap: anywhere; }
1145
+ .aura-page-header__eyebrow { margin: 0; font-family: var(--font-mono); font-size: max(12px, .75rem); line-height: 1.7; color: var(--aura-fg-secondary); overflow-wrap: anywhere; }
1146
+ .aura-page-header__title { margin: 0; font-family: var(--font-display); font-size: max(28px, 1.75rem); line-height: 1.15; font-weight: 600; letter-spacing: -0.01em; color: var(--aura-fg-primary); overflow-wrap: anywhere; }
1143
1147
  .aura-page-header__breadcrumb { min-width: 0; } /* 5.33 (DxT Monitor #7): Breadcrumb keeps its own type */
1144
- .aura-page-header__meta { min-width: 0; font-size: 13px; line-height: 1.5; color: var(--aura-fg-secondary); overflow-wrap: anywhere; }
1148
+ .aura-page-header__meta { min-width: 0; font-size: max(13px, .8125rem); line-height: 1.5; color: var(--aura-fg-secondary); overflow-wrap: anywhere; }
1145
1149
  .aura-page-header__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-2); }
1150
+ /* 5.41 (DxT Monitor #20): titleHideBelow — the title is visually hidden (still the heading), the breadcrumb and eyebrow
1151
+ * are gone; with no meta line the text block takes no room, so the actions start the header. */
1152
+ @media (max-width: 639.98px) {
1153
+ .aura-page-header--title-hide-below-sm .aura-page-header__title, .aura-page-header--title-hide-below-sm.has-no-meta > .aura-page-header__text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
1154
+ .aura-page-header--title-hide-below-sm :is(.aura-page-header__breadcrumb, .aura-page-header__eyebrow) { display: none; }
1155
+ }
1156
+ @media (max-width: 767.98px) {
1157
+ .aura-page-header--title-hide-below-md .aura-page-header__title, .aura-page-header--title-hide-below-md.has-no-meta > .aura-page-header__text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
1158
+ .aura-page-header--title-hide-below-md :is(.aura-page-header__breadcrumb, .aura-page-header__eyebrow) { display: none; }
1159
+ }
1160
+ @media (max-width: 1023.98px) {
1161
+ .aura-page-header--title-hide-below-lg .aura-page-header__title, .aura-page-header--title-hide-below-lg.has-no-meta > .aura-page-header__text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
1162
+ .aura-page-header--title-hide-below-lg :is(.aura-page-header__breadcrumb, .aura-page-header__eyebrow) { display: none; }
1163
+ }
1146
1164
  /* 5.37 (DxT Monitor #17): actionsFullWidthBelow — the actions take the row under the text; their children share
1147
1165
  * each line equally (wrapping when a label won't fit), a trigger inside a DropdownMenu, Tooltip or Popover wrapper
1148
1166
  * fills it, and icon buttons keep their size. The :has rule is alone so older browsers drop only it. */
@@ -1167,7 +1185,7 @@ a.aura-tab { text-decoration: none; }
1167
1185
  .aura-page-header--actions-full-below-lg > .aura-page-header__actions > .aura-icon-btn { flex: none; }
1168
1186
  .aura-page-header--actions-full-below-lg > .aura-page-header__actions > :has(> .aura-icon-btn) { flex: none; }
1169
1187
  }
1170
- @media (min-width: 640px) { .aura-page-header__title { font-size: 36px; } }
1188
+ @media (min-width: 640px) { .aura-page-header__title { font-size: max(36px, 2.25rem); } }
1171
1189
  /* Thai marks need the room a 1.15 line takes away. */
1172
1190
  .aura-page-header__title:lang(th) { line-height: 1.4; letter-spacing: 0; }
1173
1191
  .aura-page-header__meta:lang(th) { line-height: 1.6; }
@@ -1185,27 +1203,27 @@ a.aura-tab { text-decoration: none; }
1185
1203
  box-sizing: border-box; display: flex; flex-direction: column; gap: var(--aura-space-2); min-width: 0;
1186
1204
  padding: var(--aura-space-5); background: var(--aura-bg-surface); color: var(--aura-fg-primary);
1187
1205
  border: 1px solid var(--aura-border-default); border-radius: var(--aura-card-radius); box-shadow: var(--aura-shadow-enterprise);
1188
- font-family: var(--font-sans); font-size: 14px; text-align: left; text-decoration: none;
1206
+ font-family: var(--font-sans); font-size: max(14px, .875rem); text-align: left; text-decoration: none;
1189
1207
  }
1190
1208
  button.aura-stat { font: inherit; width: 100%; cursor: pointer; }
1191
1209
  .aura-stat.is-interactive { cursor: pointer; transition: border-color var(--aura-duration-fast) var(--aura-ease), background var(--aura-duration-fast) var(--aura-ease); }
1192
1210
  .aura-stat.is-interactive:hover { border-color: var(--aura-border-strong); }
1193
1211
  .aura-stat.is-interactive:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: var(--aura-focus-ring-offset); }
1194
1212
  .aura-stat__head { display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-2); }
1195
- .aura-stat__label { margin: 0; font-size: 13px; font-weight: 500; color: var(--aura-fg-secondary); } /* 5.14: may be a heading */
1213
+ .aura-stat__label { margin: 0; font-size: max(13px, .8125rem); font-weight: 500; color: var(--aura-fg-secondary); } /* 5.14: may be a heading */
1196
1214
  .aura-stat__icon { display: inline-flex; color: var(--aura-fg-secondary); }
1197
- .aura-stat__value { display: flex; align-items: baseline; gap: var(--aura-space-1); font-size: 28px; line-height: 1.2; font-weight: 600; letter-spacing: -0.01em; min-height: 34px; }
1215
+ .aura-stat__value { display: flex; align-items: baseline; gap: var(--aura-space-1); font-size: max(28px, 1.75rem); line-height: 1.2; font-weight: 600; letter-spacing: -0.01em; min-height: 34px; }
1198
1216
  .aura-stat__value.is-numeric { font-variant-numeric: tabular-nums; }
1199
- .aura-stat__unit { font-size: 14px; font-weight: 500; color: var(--aura-fg-secondary); letter-spacing: 0; }
1217
+ .aura-stat__unit { font-size: max(14px, .875rem); font-weight: 500; color: var(--aura-fg-secondary); letter-spacing: 0; }
1200
1218
  .aura-stat__skel { width: 55%; height: 24px; align-self: center; }
1201
- .aura-stat__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); font-size: 12px; }
1219
+ .aura-stat__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); font-size: max(12px, .75rem); }
1202
1220
  .aura-stat__change { display: inline-flex; align-items: center; gap: 2px; font-weight: 600; font-variant-numeric: tabular-nums; }
1203
1221
  .aura-stat__change.is-positive { color: var(--aura-fg-positive); }
1204
1222
  .aura-stat__change.is-negative { color: var(--aura-fg-danger); }
1205
1223
  .aura-stat__change.is-neutral { color: var(--aura-fg-secondary); }
1206
1224
  .aura-stat__caption { color: var(--aura-fg-secondary); }
1207
1225
  /* 5.17 (Chamber-OS 110): a status line under the value, and a link on the label that covers the tile. */
1208
- .aura-stat__status { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); font-size: 13px; color: var(--aura-fg-secondary); }
1226
+ .aura-stat__status { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); font-size: max(13px, .8125rem); color: var(--aura-fg-secondary); }
1209
1227
  .aura-stat--label-link { position: relative; }
1210
1228
  .aura-stat__link { color: inherit; text-decoration: none; }
1211
1229
  .aura-stat__link::after { content: ''; position: absolute; inset: 0; border-radius: var(--aura-card-radius); }
@@ -1227,7 +1245,7 @@ button.aura-stat { font: inherit; width: 100%; cursor: pointer; }
1227
1245
  position: relative; box-sizing: border-box; display: flex; flex-direction: column; gap: 2px; min-width: 0;
1228
1246
  padding: var(--aura-space-2) var(--aura-space-3); background: var(--aura-bg-surface); color: var(--aura-fg-primary);
1229
1247
  border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-sm);
1230
- font-family: var(--font-sans); font-size: 13px; line-height: 18px; text-align: start; text-decoration: none;
1248
+ font-family: var(--font-sans); font-size: max(13px, .8125rem); line-height: max(18px, 1.125rem); text-align: start; text-decoration: none;
1231
1249
  --aura-hover: var(--aura-bg-surface-hover);
1232
1250
  }
1233
1251
  .aura-status-tile--down { background: var(--aura-alert-danger-bg); border-color: var(--aura-alert-danger-border); }
@@ -1263,11 +1281,11 @@ button.aura-stat { font: inherit; width: 100%; cursor: pointer; }
1263
1281
  .aura-status-tile__value { flex-basis: 100%; margin-inline-start: 0; padding-inline-start: 24px; }
1264
1282
  }
1265
1283
  /* The second line starts under the title. */
1266
- .aura-status-tile__foot { display: flex; align-items: center; gap: var(--aura-space-2); min-width: 0; padding-inline-start: 24px; font-size: 12px; color: var(--aura-fg-secondary); }
1284
+ .aura-status-tile__foot { display: flex; align-items: center; gap: var(--aura-space-2); min-width: 0; padding-inline-start: 24px; font-size: max(12px, .75rem); color: var(--aura-fg-secondary); }
1267
1285
  .aura-status-tile__meta { flex: 1; min-width: 0; overflow-wrap: anywhere; }
1268
1286
  .aura-status-tile__markers { display: inline-flex; align-items: center; gap: var(--aura-space-1); margin-inline-start: auto; flex: none; }
1269
1287
  .aura-status-tile__marker { display: inline-flex; }
1270
- .aura-status-tile:lang(th) { line-height: 20px; }
1288
+ .aura-status-tile:lang(th) { line-height: max(20px, 1.25rem); }
1271
1289
  .aura-sparkline { display: inline-block; flex: none; vertical-align: middle; overflow: visible; color: var(--aura-fg-secondary); }
1272
1290
  .aura-sparkline.is-accent { color: var(--aura-fg-accent); }
1273
1291
  .aura-sparkline.is-danger { color: var(--aura-fg-danger); }
@@ -1290,7 +1308,7 @@ button.aura-stat { font: inherit; width: 100%; cursor: pointer; }
1290
1308
  .aura-upload {
1291
1309
  position: relative; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--aura-space-2);
1292
1310
  min-height: 96px; padding: var(--aura-space-5); text-align: center; cursor: pointer;
1293
- background: var(--aura-bg-input); color: var(--aura-fg-secondary); font-size: 14px;
1311
+ background: var(--aura-bg-input); color: var(--aura-fg-secondary); font-size: max(14px, .875rem);
1294
1312
  border: 1px dashed var(--aura-border-control); border-radius: var(--aura-radius-md);
1295
1313
  transition: border-color var(--aura-duration-fast) var(--aura-ease), background var(--aura-duration-fast) var(--aura-ease);
1296
1314
  }
@@ -1301,7 +1319,7 @@ button.aura-stat { font: inherit; width: 100%; cursor: pointer; }
1301
1319
  .aura-upload.is-disabled { opacity: var(--aura-disabled-opacity); pointer-events: none; background: var(--aura-bg-input-disabled); }
1302
1320
  .aura-upload__icon { flex-basis: 100%; color: var(--aura-fg-secondary); }
1303
1321
  .aura-upload__browse { color: var(--aura-fg-accent); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; }
1304
- .aura-upload__note { flex-basis: 100%; font-size: 12px; color: var(--aura-fg-secondary); }
1322
+ .aura-upload__note { flex-basis: 100%; font-size: max(12px, .75rem); color: var(--aura-fg-secondary); }
1305
1323
  .aura-upload__input { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
1306
1324
  .aura-upload__list { list-style: none; margin: var(--aura-space-3) 0 0; padding: 0; display: grid; gap: var(--aura-space-2); }
1307
1325
  .aura-upload__item {
@@ -1312,26 +1330,26 @@ button.aura-stat { font: inherit; width: 100%; cursor: pointer; }
1312
1330
  .aura-upload__thumb { flex: none; width: 40px; height: 40px; border-radius: var(--aura-radius-sm); object-fit: cover; background: var(--aura-bg-surface-hover); }
1313
1331
  .aura-upload__thumb.is-icon { display: inline-flex; align-items: center; justify-content: center; color: var(--aura-fg-secondary); }
1314
1332
  .aura-upload__meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
1315
- .aura-upload__name { font-size: 13px; font-weight: 500; color: var(--aura-fg-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
1333
+ .aura-upload__name { font-size: max(13px, .8125rem); font-weight: 500; color: var(--aura-fg-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
1316
1334
  a.aura-upload__name { color: var(--aura-fg-accent); text-decoration: underline; text-underline-offset: 2px; border-radius: var(--aura-radius-xs); }
1317
1335
  a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 2px; }
1318
- .aura-upload__sub { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--aura-fg-secondary); }
1336
+ .aura-upload__sub { display: inline-flex; align-items: center; gap: 4px; font-size: max(12px, .75rem); color: var(--aura-fg-secondary); }
1319
1337
  .aura-upload__item.is-error .aura-upload__sub { color: var(--aura-fg-danger); }
1320
1338
  .aura-upload__bar { display: block; height: 4px; border-radius: var(--aura-radius-full); background: var(--aura-progress-track); box-shadow: inset 0 0 0 1px var(--aura-progress-track-edge); overflow: hidden; }
1321
1339
  .aura-upload__bar > span { display: block; height: 100%; background: var(--aura-fg-accent); transition: width var(--aura-duration-base) var(--aura-ease); }
1322
1340
 
1323
1341
  /* ---------- Checkbox with a visible label ---------- */
1324
- .aura-check--labelled { width: auto; height: auto; max-width: 100%; display: inline-flex; align-items: flex-start; gap: var(--aura-space-2); cursor: pointer; font-size: 14px; line-height: 1.5; color: var(--aura-fg-primary); }
1342
+ .aura-check--labelled { width: auto; height: auto; max-width: 100%; display: inline-flex; align-items: flex-start; gap: var(--aura-space-2); cursor: pointer; font-size: max(14px, .875rem); line-height: 1.5; color: var(--aura-fg-primary); }
1325
1343
  .aura-check--labelled .aura-check__input { inset: auto; top: 3px; left: 0; width: var(--aura-icon-sm); height: var(--aura-icon-sm); }
1326
1344
  .aura-check--labelled .aura-check__box { flex: none; width: var(--aura-icon-sm); height: var(--aura-icon-sm); margin-top: 3px; }
1327
1345
  .aura-check__text { display: flex; flex-direction: column; }
1328
- .aura-check__desc { font-size: 12px; color: var(--aura-fg-secondary); }
1346
+ .aura-check__desc { font-size: max(12px, .75rem); color: var(--aura-fg-secondary); }
1329
1347
  .aura-check.is-disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
1330
1348
 
1331
1349
  /* ---------- Badge ---------- */
1332
1350
  .aura-badge {
1333
- display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 var(--aura-space-2); box-sizing: border-box;
1334
- border-radius: var(--aura-radius-full); border: 1px solid transparent; font-family: var(--font-sans); font-size: 11px; font-weight: 600; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums;
1351
+ display: inline-flex; align-items: center; gap: 4px; min-height: 20px; padding: 0 var(--aura-space-2); box-sizing: border-box; /* 5.40: min-, so a larger default font grows it */
1352
+ border-radius: var(--aura-radius-full); border: 1px solid transparent; font-family: var(--font-sans); font-size: max(11px, .6875rem); font-weight: 600; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums;
1335
1353
  background: var(--aura-status-neutral-bg); color: var(--aura-status-neutral-fg); /* 5.30: surface-hover vanished on the light canvas */
1336
1354
  }
1337
1355
  .aura-badge--accent { background: var(--aura-alert-info-bg); color: var(--aura-alert-info-fg); }
@@ -1347,7 +1365,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1347
1365
  .aura-tag {
1348
1366
  display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 var(--aura-space-3); box-sizing: border-box;
1349
1367
  border: 1px solid var(--aura-border-control); border-radius: var(--aura-radius-full); background: var(--aura-bg-surface); color: var(--aura-fg-primary);
1350
- font-family: var(--font-sans); font-size: 13px; font-weight: 500; white-space: nowrap;
1368
+ font-family: var(--font-sans); font-size: max(13px, .8125rem); font-weight: 500; white-space: nowrap;
1351
1369
  }
1352
1370
  .aura-tag__text { overflow: hidden; text-overflow: ellipsis; max-width: 24ch; }
1353
1371
  .aura-tag.is-selectable { cursor: pointer; transition: background var(--aura-duration-fast) var(--aura-ease), border-color var(--aura-duration-fast) var(--aura-ease); }
@@ -1363,7 +1381,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1363
1381
 
1364
1382
  /* ---------- Progress ---------- */
1365
1383
  .aura-progress { display: flex; flex-direction: column; gap: 6px; font-family: var(--font-sans); }
1366
- .aura-progress__head { display: flex; justify-content: space-between; gap: var(--aura-space-2); font-size: 13px; }
1384
+ .aura-progress__head { display: flex; justify-content: space-between; gap: var(--aura-space-2); font-size: max(13px, .8125rem); }
1367
1385
  .aura-progress__label { font-weight: 500; color: var(--aura-fg-primary); }
1368
1386
  .aura-progress__value { color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums; }
1369
1387
  .aura-progress__track { position: relative; height: 8px; border-radius: var(--aura-radius-full); background: var(--aura-progress-track); box-shadow: inset 0 0 0 1px var(--aura-progress-track-edge); overflow: hidden; }
@@ -1382,7 +1400,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1382
1400
  .aura-progress__track.is-indeterminate .aura-progress__bar { width: 35%; animation: aura-progress-slide var(--aura-duration-pulse) var(--aura-ease) infinite; }
1383
1401
  @keyframes aura-progress-slide { from { left: -35%; } to { left: 100%; } }
1384
1402
  @media (prefers-reduced-motion: reduce) { .aura-progress__track.is-indeterminate .aura-progress__bar { animation-duration: calc(var(--aura-duration-pulse) * 3); } }
1385
- .aura-progress__hint { margin: 0; font-size: 12px; color: var(--aura-fg-secondary); }
1403
+ .aura-progress__hint { margin: 0; font-size: max(12px, .75rem); color: var(--aura-fg-secondary); }
1386
1404
 
1387
1405
  /* ---------- Skeleton ---------- */
1388
1406
  .aura-skel--text { height: 10px; margin: 5px 0; }
@@ -1397,8 +1415,8 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1397
1415
  .aura-empty.is-bordered { border: 1px dashed var(--aura-border-control); border-radius: var(--aura-radius-lg); }
1398
1416
  .aura-empty__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: var(--aura-space-2); border-radius: var(--aura-radius-full); background: var(--aura-status-neutral-bg); color: var(--aura-fg-secondary); }
1399
1417
  .aura-empty.is-sm .aura-empty__icon { width: 36px; height: 36px; }
1400
- .aura-empty__title { margin: 0; font-size: 16px; line-height: 1.5; font-weight: 600; }
1401
- .aura-empty__text { margin: 0; max-width: 44ch; font-size: 14px; line-height: 1.6; color: var(--aura-fg-secondary); }
1418
+ .aura-empty__title { margin: 0; font-size: max(16px, 1rem); line-height: 1.5; font-weight: 600; }
1419
+ .aura-empty__text { margin: 0; max-width: 44ch; font-size: max(14px, .875rem); line-height: 1.6; color: var(--aura-fg-secondary); }
1402
1420
  .aura-empty__action { margin-top: var(--aura-space-3); display: flex; gap: var(--aura-space-3); flex-wrap: wrap; justify-content: center; }
1403
1421
  /* 5.13 (Chamber-OS 82): tone="danger" — a load failure. */
1404
1422
  .aura-empty.is-danger { background: var(--aura-alert-danger-bg); border-radius: var(--aura-radius-lg); }
@@ -1406,7 +1424,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1406
1424
  .aura-empty.is-danger .aura-empty__icon { background: var(--aura-bg-surface); color: var(--aura-fg-danger); }
1407
1425
 
1408
1426
  /* ---------- Pagination ---------- */
1409
- .aura-pagination { display: flex; align-items: center; gap: var(--aura-space-1); font-family: var(--font-sans); font-size: 13px; }
1427
+ .aura-pagination { display: flex; align-items: center; gap: var(--aura-space-1); font-family: var(--font-sans); font-size: max(13px, .8125rem); }
1410
1428
  .aura-pagination__list { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
1411
1429
  .aura-page {
1412
1430
  display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 var(--aura-space-2); box-sizing: border-box;
@@ -1425,7 +1443,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1425
1443
  /* ---------- Accordion ---------- */
1426
1444
  .aura-accordion { border-top: 1px solid var(--aura-border-default); font-family: var(--font-sans); }
1427
1445
  .aura-accordion__item { border-bottom: 1px solid var(--aura-border-default); }
1428
- .aura-accordion__heading { margin: 0; font-size: 14px; font-weight: 600; }
1446
+ .aura-accordion__heading { margin: 0; font-size: max(14px, .875rem); font-weight: 600; }
1429
1447
  .aura-accordion__heading > button {
1430
1448
  display: flex; align-items: center; gap: var(--aura-space-3); width: 100%; min-height: 48px; padding: var(--aura-space-3) var(--aura-space-1); box-sizing: border-box;
1431
1449
  border: 0; background: transparent; color: var(--aura-fg-primary); font: inherit; text-align: left; cursor: pointer;
@@ -1434,22 +1452,22 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1434
1452
  .aura-accordion__heading > button:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: calc(-1 * var(--aura-focus-ring-width)); border-radius: var(--aura-radius-sm); }
1435
1453
  .aura-accordion__heading > button:disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
1436
1454
  .aura-accordion__title { flex: 1; display: flex; flex-direction: column; gap: 2px; }
1437
- .aura-accordion__desc { font-size: 13px; font-weight: 400; color: var(--aura-fg-secondary); }
1455
+ .aura-accordion__desc { font-size: max(13px, .8125rem); font-weight: 400; color: var(--aura-fg-secondary); }
1438
1456
  .aura-accordion__lead { color: var(--aura-fg-secondary); }
1439
1457
  .aura-accordion__chevron { flex: none; color: var(--aura-fg-secondary); transition: transform var(--aura-duration-fast) var(--aura-ease); }
1440
1458
  .aura-accordion__item.is-open .aura-accordion__chevron { transform: rotate(180deg); }
1441
- .aura-accordion__panel { padding: 0 var(--aura-space-1) var(--aura-space-4); font-size: 14px; line-height: 1.7; color: var(--aura-fg-primary); }
1459
+ .aura-accordion__panel { padding: 0 var(--aura-space-1) var(--aura-space-4); font-size: max(14px, .875rem); line-height: 1.7; color: var(--aura-fg-primary); }
1442
1460
 
1443
1461
  /* ---------- Popover ---------- */
1444
1462
  .aura-popover-anchor { display: inline-flex; }
1445
1463
  .aura-popover {
1446
1464
  position: fixed; z-index: var(--aura-z-menu); box-sizing: border-box; width: max-content; min-width: 200px; max-width: min(360px, calc(100vw - 16px));
1447
1465
  background: var(--aura-bg-surface); color: var(--aura-fg-primary); border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-lg);
1448
- box-shadow: var(--aura-shadow-overlay); font-family: var(--font-sans); font-size: 14px; outline: none; animation: aura-fade-in var(--aura-duration-fast) var(--aura-ease);
1466
+ box-shadow: var(--aura-shadow-overlay); font-family: var(--font-sans); font-size: max(14px, .875rem); outline: none; animation: aura-fade-in var(--aura-duration-fast) var(--aura-ease);
1449
1467
  overflow-y: auto; overscroll-behavior: contain;
1450
1468
  }
1451
1469
  .aura-popover__head { display: flex; align-items: center; justify-content: space-between; gap: var(--aura-space-2); padding: var(--aura-space-2) var(--aura-space-2) 0 var(--aura-space-4); position: sticky; top: 0; z-index: 1; background: var(--aura-bg-surface); } /* 5.2: stays while a tall popover scrolls */
1452
- .aura-popover__title { margin: 0; font-size: 14px; font-weight: 600; }
1470
+ .aura-popover__title { margin: 0; font-size: max(14px, .875rem); font-weight: 600; }
1453
1471
  .aura-popover__body { padding: var(--aura-space-4); }
1454
1472
  .aura-popover__head + .aura-popover__body { padding-top: var(--aura-space-2); }
1455
1473
  @media (prefers-reduced-motion: reduce) { .aura-popover { animation: none; } }
@@ -1464,7 +1482,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1464
1482
  .aura-combo__chip {
1465
1483
  display: inline-flex; align-items: center; gap: 2px; max-width: 100%; height: 28px; box-sizing: border-box;
1466
1484
  padding: 0 2px 0 var(--aura-space-2); border-radius: var(--aura-radius-full);
1467
- background: var(--aura-bg-selected); color: var(--aura-fg-primary); font-size: 13px; font-weight: 500;
1485
+ background: var(--aura-bg-selected); color: var(--aura-fg-primary); font-size: max(13px, .8125rem); font-weight: 500;
1468
1486
  }
1469
1487
  .aura-combo__chip-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 24ch; }
1470
1488
  .aura-combo__chip-remove {
@@ -1476,7 +1494,7 @@ a.aura-upload__name:focus-visible { outline: var(--aura-focus-ring-width) solid
1476
1494
 
1477
1495
  /* ---------- NumberField ---------- */
1478
1496
  .aura-number .aura-input__control { font-variant-numeric: tabular-nums; }
1479
- .aura-number__affix { padding-left: var(--aura-space-3); color: var(--aura-fg-secondary); font-size: 14px; white-space: nowrap; }
1497
+ .aura-number__affix { padding-left: var(--aura-space-3); color: var(--aura-fg-secondary); font-size: max(14px, .875rem); white-space: nowrap; }
1480
1498
  .aura-number__affix + .aura-input__control { padding-left: var(--aura-space-2); }
1481
1499
  .aura-input__control + .aura-number__affix { padding: 0 var(--aura-space-2) 0 0; }
1482
1500
  .aura-number__steps { display: flex; align-self: stretch; border-left: 1px solid var(--aura-border-default); }
@@ -1504,16 +1522,16 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1504
1522
  .aura-stepper__marker {
1505
1523
  position: relative; z-index: 1; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; box-sizing: border-box;
1506
1524
  border-radius: var(--aura-radius-full); border: 1px solid var(--aura-border-control); background: var(--aura-bg-surface);
1507
- color: var(--aura-fg-secondary); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums;
1525
+ color: var(--aura-fg-secondary); font-size: max(13px, .8125rem); font-weight: 600; font-variant-numeric: tabular-nums;
1508
1526
  }
1509
1527
  .aura-stepper__marker .aura-icon { width: 16px; height: 16px; }
1510
1528
  .aura-stepper__item.is-done .aura-stepper__marker { background: var(--aura-control-checked-bg); border-color: var(--aura-control-checked-bg); color: var(--aura-control-checked-fg); }
1511
1529
  .aura-stepper__item.is-current .aura-stepper__marker { border: 2px solid var(--aura-fg-accent); color: var(--aura-fg-accent); }
1512
1530
  .aura-stepper__text { display: flex; flex-direction: column; min-width: 0; padding-top: 4px; }
1513
- .aura-stepper__label { font-size: 13px; font-weight: 500; line-height: 1.4; color: var(--aura-fg-secondary); }
1531
+ .aura-stepper__label { font-size: max(13px, .8125rem); font-weight: 500; line-height: 1.4; color: var(--aura-fg-secondary); }
1514
1532
  .aura-stepper__item.is-current .aura-stepper__label, .aura-stepper__item.is-done .aura-stepper__label { color: var(--aura-fg-primary); }
1515
1533
  .aura-stepper__item.is-current .aura-stepper__label { font-weight: 600; }
1516
- .aura-stepper__desc { font-size: 12px; line-height: 1.5; color: var(--aura-fg-secondary); }
1534
+ .aura-stepper__desc { font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
1517
1535
  /* Connector: a line from each marker to the next (labels sit under the markers), or down the left when vertical. */
1518
1536
  .aura-stepper--horizontal .aura-stepper__item:not(:last-child)::after {
1519
1537
  content: ""; position: absolute; top: 14px; left: 36px; right: var(--aura-space-2); height: 1px; background: var(--aura-border-control); pointer-events: none;
@@ -1526,7 +1544,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1526
1544
  content: ""; position: absolute; left: 14px; top: 32px; bottom: 4px; width: 1px; background: var(--aura-border-control);
1527
1545
  }
1528
1546
  .aura-stepper--vertical .aura-stepper__item.is-done::after { background: var(--aura-control-checked-bg); }
1529
- .aura-stepper__compact { display: none; margin: var(--aura-space-2) 0 0; font-size: 13px; }
1547
+ .aura-stepper__compact { display: none; margin: var(--aura-space-2) 0 0; font-size: max(13px, .8125rem); }
1530
1548
  .aura-stepper__count { color: var(--aura-fg-secondary); margin-right: var(--aura-space-2); }
1531
1549
  .aura-stepper__compact-label { font-weight: 600; }
1532
1550
  /* 5.18 (Chamber-OS 112): a step with errors — the danger fill and an alert icon; outlined when it is the current step. */
@@ -1547,7 +1565,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1547
1565
  height: calc(var(--aura-input-height) - 6px); /* 5.30: the control is as tall as a field beside it (2px padding, 1px edge) */
1548
1566
  padding: 0 var(--aura-space-4); box-sizing: border-box;
1549
1567
  border: 0; border-radius: var(--aura-radius-full); background: transparent; color: var(--aura-fg-secondary);
1550
- font: inherit; font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer;
1568
+ font: inherit; font-size: max(13px, .8125rem); font-weight: 500; white-space: nowrap; cursor: pointer;
1551
1569
  transition: background-color var(--aura-duration-fast) var(--aura-ease), color var(--aura-duration-fast) var(--aura-ease), box-shadow var(--aura-duration-fast) var(--aura-ease);
1552
1570
  }
1553
1571
  .aura-segmented.is-full .aura-segmented__option { flex: 1 1 0; min-width: 0; }
@@ -1556,7 +1574,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1556
1574
  .aura-segmented__option.is-selected { background: var(--aura-segmented-thumb-bg); color: var(--aura-fg-primary); font-weight: 600; box-shadow: inset 0 0 0 1px var(--aura-border-control), var(--aura-shadow-enterprise); } /* 5.2: the edge marks the choice at 3:1; the fill alone was 1.04:1 on the track */
1557
1575
  .aura-segmented__option:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 1px; }
1558
1576
  .aura-segmented__option:disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
1559
- .aura-segmented--sm .aura-segmented__option { height: 24px; padding: 0 var(--aura-space-3); font-size: 12px; }
1577
+ .aura-segmented--sm .aura-segmented__option { height: auto; min-height: 24px; padding: 0 var(--aura-space-3); font-size: max(12px, .75rem); }
1560
1578
  .aura-segmented--sm .aura-segmented__option.is-icon { width: 28px; padding: 0; }
1561
1579
  .aura-segmented.is-disabled { opacity: var(--aura-disabled-opacity); }
1562
1580
  /* 5.37 (DxT Monitor #18): touchHeight — 44px options below 640px or on a coarse pointer (is-touch), or always. */
@@ -1644,7 +1662,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1644
1662
  .aura-toaster.is-top { top: calc(var(--aura-toaster-offset, var(--aura-space-4)) + env(safe-area-inset-top, 0px)); }
1645
1663
  .aura-card { padding: var(--aura-space-4); --aura-card-bleed: var(--aura-space-4); }
1646
1664
  .aura-stat { padding: var(--aura-space-4); }
1647
- .aura-stat__value { font-size: 24px; }
1665
+ .aura-stat__value { font-size: max(24px, 1.5rem); }
1648
1666
  .aura-tabs__list { gap: var(--aura-space-4); }
1649
1667
  }
1650
1668
  @keyframes aura-sheet-in { from { transform: translateY(24px); opacity: 0; } }
@@ -1709,22 +1727,22 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1709
1727
  /* FormErrorSummary: a danger alert whose items link to their fields */
1710
1728
  .aura-error-summary:focus-visible, .aura-error-summary:focus { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: var(--aura-focus-ring-offset); }
1711
1729
  .aura-error-summary h2.aura-alert__title { font-family: inherit; }
1712
- .aura-error-summary__list { margin: var(--aura-space-2) 0 0; padding-left: var(--aura-space-5); display: grid; gap: var(--aura-space-1); font-size: 14px; line-height: 20px; }
1730
+ .aura-error-summary__list { margin: var(--aura-space-2) 0 0; padding-left: var(--aura-space-5); display: grid; gap: var(--aura-space-1); font-size: max(14px, .875rem); line-height: max(20px, 1.25rem); }
1713
1731
  .aura-error-summary__list a { color: var(--aura-alert-danger-fg); text-decoration: underline; text-underline-offset: 2px; font-weight: 500; }
1714
1732
  .aura-error-summary__list a:hover { text-decoration-thickness: 2px; }
1715
1733
  .aura-error-summary__list a:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: 2px; border-radius: var(--aura-radius-xs); }
1716
1734
 
1717
1735
  /* aura-prose: sanitised rich text (editor output, e-mail previews). Styles exactly p, h1–h4, ul/ol/li, blockquote,
1718
1736
  * hr, a, strong, em, u with AURA type and spacing, in both themes. */
1719
- .aura-prose { font-family: var(--font-sans); font-size: 14px; line-height: 1.7; color: var(--aura-fg-primary); overflow-wrap: anywhere; }
1737
+ .aura-prose { font-family: var(--font-sans); font-size: max(14px, .875rem); line-height: 1.7; color: var(--aura-fg-primary); overflow-wrap: anywhere; }
1720
1738
  .aura-prose > :first-child { margin-top: 0; }
1721
1739
  .aura-prose > :last-child { margin-bottom: 0; }
1722
1740
  .aura-prose p { margin: 0 0 var(--aura-space-4); }
1723
1741
  .aura-prose h1, .aura-prose h2, .aura-prose h3, .aura-prose h4 { color: var(--aura-fg-primary); margin: var(--aura-space-8) 0 var(--aura-space-3); }
1724
- .aura-prose h1 { font-family: var(--font-display); font-weight: 600; font-size: 30px; line-height: 1.2; letter-spacing: -0.01em; }
1725
- .aura-prose h2 { font-weight: 600; font-size: 22px; line-height: 1.3; }
1726
- .aura-prose h3 { font-weight: 600; font-size: 17px; line-height: 1.45; }
1727
- .aura-prose h4 { font-weight: 600; font-size: 15px; line-height: 1.5; }
1742
+ .aura-prose h1 { font-family: var(--font-display); font-weight: 600; font-size: max(30px, 1.875rem); line-height: 1.2; letter-spacing: -0.01em; }
1743
+ .aura-prose h2 { font-weight: 600; font-size: max(22px, 1.375rem); line-height: 1.3; }
1744
+ .aura-prose h3 { font-weight: 600; font-size: max(17px, 1.0625rem); line-height: 1.45; }
1745
+ .aura-prose h4 { font-weight: 600; font-size: max(15px, .9375rem); line-height: 1.5; }
1728
1746
  .aura-prose ul, .aura-prose ol { margin: 0 0 var(--aura-space-4); padding-left: var(--aura-space-6); }
1729
1747
  .aura-prose li { margin: var(--aura-space-1) 0; }
1730
1748
  .aura-prose li > ul, .aura-prose li > ol { margin: var(--aura-space-1) 0 0; }
@@ -1748,7 +1766,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1748
1766
  .aura-filterbar__clear-search { margin-right: 6px; }
1749
1767
  .aura-filterbar__controls { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-3); }
1750
1768
  .aura-filterbar__spacer { flex: 1 1 0; }
1751
- .aura-filterbar__count { font-size: 13px; color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; }
1769
+ .aura-filterbar__count { font-size: max(13px, .8125rem); color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; }
1752
1770
  .aura-filterbar__actions { display: flex; align-items: center; gap: var(--aura-space-2); }
1753
1771
  .aura-filterbar__chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-2); }
1754
1772
  /* 5.28 (Chamber-OS 132): an applied-filter chip takes its text's width, cut only when it is wider than the row. */
@@ -1759,7 +1777,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1759
1777
  .aura-filterbar__chips > .aura-tag .aura-tag__text { max-width: none; min-width: 0; }
1760
1778
  .aura-filterbar__clear {
1761
1779
  border: 0; background: transparent; padding: 4px var(--aura-space-2); border-radius: var(--aura-radius-sm);
1762
- font: inherit; font-size: 13px; font-weight: 500; color: var(--aura-fg-accent); cursor: pointer; text-decoration: underline; text-underline-offset: 2px;
1780
+ font: inherit; font-size: max(13px, .8125rem); font-weight: 500; color: var(--aura-fg-accent); cursor: pointer; text-decoration: underline; text-underline-offset: 2px;
1763
1781
  }
1764
1782
  .aura-filterbar__clear:hover { background: var(--aura-hover, var(--aura-bg-surface-hover)); }
1765
1783
  .aura-filterbar__clear:focus-visible { outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: var(--aura-focus-ring-offset); }
@@ -1790,7 +1808,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1790
1808
  min-height: var(--aura-input-height); padding-block: 0; padding-inline: var(--aura-space-2) var(--aura-space-1);
1791
1809
  background: var(--aura-bg-input); color: var(--aura-fg-primary);
1792
1810
  border: 1px solid var(--aura-border-control); border-radius: var(--aura-radius-md);
1793
- font: inherit; font-size: 13px; line-height: 18px; text-align: start; cursor: pointer;
1811
+ font: inherit; font-size: max(13px, .8125rem); line-height: max(18px, 1.125rem); text-align: start; cursor: pointer;
1794
1812
  transition: border-color var(--aura-duration-fast) var(--aura-ease);
1795
1813
  }
1796
1814
  .aura-filterselect__face:hover { border-color: var(--aura-fg-secondary); }
@@ -1800,7 +1818,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1800
1818
  /* 5.30: from 640px the face has a field's inset and text size, like the search box beside it; phones keep the tight
1801
1819
  * face so three filters and a chip share one row. */
1802
1820
  @media (min-width: 640px) {
1803
- .aura-filterselect__face { padding-inline: var(--aura-space-3) var(--aura-space-2); font-size: 14px; }
1821
+ .aura-filterselect__face { padding-inline: var(--aura-space-3) var(--aura-space-2); font-size: max(14px, .875rem); }
1804
1822
  .aura-filterselect__chevron { width: var(--aura-icon-sm); height: var(--aura-icon-sm); }
1805
1823
  }
1806
1824
  .aura-filterselect.is-open .aura-filterselect__chevron { transform: rotate(180deg); }
@@ -1810,7 +1828,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1810
1828
  .aura-filterselect__face:focus { outline-style: none; }
1811
1829
  .aura-filterselect__face:focus-visible { outline-style: solid; }
1812
1830
  /* Before hydration: the real <select>, invisible, over the face (16px so iOS doesn't zoom when it opens). */
1813
- .aura-filterselect__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; font-size: 16px; cursor: pointer; appearance: none; }
1831
+ .aura-filterselect__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; font-size: max(16px, 1rem); cursor: pointer; appearance: none; }
1814
1832
  .aura-filterselect.is-disabled .aura-filterselect__face { background: var(--aura-bg-input-disabled); color: var(--aura-fg-secondary); border-color: var(--aura-border-default); cursor: not-allowed; }
1815
1833
  .aura-filterselect.is-disabled .aura-filterselect__native { cursor: not-allowed; }
1816
1834
  /* 5.38 (Chamber-OS 140): touchHeight on FilterBar (its search and field-height controls) or on one FilterSelect —
@@ -1855,21 +1873,21 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1855
1873
  .aura-command__input::placeholder { color: var(--aura-fg-tertiary); opacity: 1; }
1856
1874
  .aura-command__list { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: var(--aura-space-2); }
1857
1875
  .aura-command__group + .aura-command__group { margin-top: var(--aura-space-2); }
1858
- .aura-command__heading { padding: var(--aura-space-2) var(--aura-space-2) var(--aura-space-1); font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--aura-fg-secondary); }
1859
- .aura-command__item { display: flex; align-items: center; gap: var(--aura-space-3); min-height: 40px; padding: 6px var(--aura-space-2); border-radius: var(--aura-radius-sm); cursor: pointer; font-size: 14px; }
1876
+ .aura-command__heading { padding: var(--aura-space-2) var(--aura-space-2) var(--aura-space-1); font-family: var(--font-mono); font-size: max(11px, .6875rem); text-transform: uppercase; letter-spacing: 0.04em; color: var(--aura-fg-secondary); }
1877
+ .aura-command__item { display: flex; align-items: center; gap: var(--aura-space-3); min-height: 40px; padding: 6px var(--aura-space-2); border-radius: var(--aura-radius-sm); cursor: pointer; font-size: max(14px, .875rem); }
1860
1878
  .aura-command__item > .aura-icon { color: var(--aura-fg-secondary); }
1861
1879
  .aura-command__item.is-active { background: var(--aura-hover, var(--aura-bg-surface-hover)); outline: var(--aura-focus-ring-width) solid var(--aura-focus-ring); outline-offset: calc(-1 * var(--aura-focus-ring-width)); }
1862
1880
  .aura-command__item.is-disabled { opacity: var(--aura-disabled-opacity); cursor: default; }
1863
1881
  .aura-command__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
1864
1882
  .aura-command__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
1865
- .aura-command__desc { font-size: 12px; line-height: 1.5; color: var(--aura-fg-secondary); }
1883
+ .aura-command__desc { font-size: max(12px, .75rem); line-height: 1.5; color: var(--aura-fg-secondary); }
1866
1884
  .aura-command__kbd {
1867
1885
  flex: none; padding: 2px 6px; border: 1px solid var(--aura-border-default); border-radius: var(--aura-radius-xs);
1868
- font-family: var(--font-mono); font-size: 11px; line-height: 16px; color: var(--aura-fg-secondary); background: var(--aura-bg-canvas);
1886
+ font-family: var(--font-mono); font-size: max(11px, .6875rem); line-height: max(16px, 1rem); color: var(--aura-fg-secondary); background: var(--aura-bg-canvas);
1869
1887
  }
1870
- .aura-command__loading { display: flex; align-items: center; gap: var(--aura-space-2); padding: var(--aura-space-2) var(--aura-space-3); font-size: 13px; color: var(--aura-fg-secondary); }
1871
- .aura-command__empty { margin: 0; padding: var(--aura-space-6) var(--aura-space-2); text-align: center; font-size: 14px; color: var(--aura-fg-secondary); }
1872
- .aura-command__foot { display: flex; justify-content: space-between; gap: var(--aura-space-3); padding: var(--aura-space-2) var(--aura-space-4); border-top: 1px solid var(--aura-border-default); font-size: 12px; color: var(--aura-fg-secondary); }
1888
+ .aura-command__loading { display: flex; align-items: center; gap: var(--aura-space-2); padding: var(--aura-space-2) var(--aura-space-3); font-size: max(13px, .8125rem); color: var(--aura-fg-secondary); }
1889
+ .aura-command__empty { margin: 0; padding: var(--aura-space-6) var(--aura-space-2); text-align: center; font-size: max(14px, .875rem); color: var(--aura-fg-secondary); }
1890
+ .aura-command__foot { display: flex; justify-content: space-between; gap: var(--aura-space-3); padding: var(--aura-space-2) var(--aura-space-4); border-top: 1px solid var(--aura-border-default); font-size: max(12px, .75rem); color: var(--aura-fg-secondary); }
1873
1891
  @media (max-width: 639.98px) {
1874
1892
  .aura-dialog-layer.aura-command-layer { align-items: flex-start; padding: var(--aura-space-4); }
1875
1893
  .aura-command { max-height: 80vh; }
@@ -1913,7 +1931,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1913
1931
  .aura-bottomnav__item {
1914
1932
  box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
1915
1933
  width: 100%; height: var(--aura-bottomnav-height); padding: 0 2px; border: 0; background: transparent;
1916
- color: var(--aura-fg-secondary); font: inherit; font-size: 11px; font-weight: 500; line-height: 14px;
1934
+ color: var(--aura-fg-secondary); font: inherit; font-size: max(11px, .6875rem); font-weight: 500; line-height: max(14px, .875rem);
1917
1935
  text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
1918
1936
  }
1919
1937
  .aura-bottomnav__item:hover { color: var(--aura-fg-primary); }
@@ -1927,9 +1945,9 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1927
1945
  .aura-bottomnav__item.is-active .aura-bottomnav__icon { background: var(--aura-bg-selected); }
1928
1946
  .aura-bottomnav__label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
1929
1947
  .aura-bottomnav__count {
1930
- position: absolute; top: -2px; left: calc(50% + 4px); min-width: 16px; height: 16px; box-sizing: border-box; padding: 0 4px;
1948
+ position: absolute; top: -2px; left: calc(50% + 4px); min-width: 16px; min-height: 16px; box-sizing: border-box; padding: 0 4px;
1931
1949
  border-radius: var(--aura-radius-full); background: var(--aura-bg-inverted); color: var(--aura-fg-inverted);
1932
- font-size: 10px; font-weight: 600; line-height: 16px; text-align: center; font-variant-numeric: tabular-nums;
1950
+ font-size: max(10px, .625rem); font-weight: 600; line-height: max(16px, 1rem); text-align: center; font-variant-numeric: tabular-nums;
1933
1951
  box-shadow: 0 0 0 2px var(--aura-bg-surface);
1934
1952
  }
1935
1953
  .aura-bottomnav__dot {
@@ -1966,7 +1984,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
1966
1984
  }
1967
1985
  .aura-actionbar--container { bottom: 0; border-top: 1px solid var(--aura-border-default); }
1968
1986
  .aura-actionbar__inner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-2) var(--aura-space-3); min-height: 60px; box-sizing: border-box; padding-block: var(--aura-space-2); padding-inline: var(--aura-space-4) var(--aura-space-3); }
1969
- .aura-actionbar__status { flex: 1 1 8rem; min-width: 0; font-size: 14px; color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums; }
1987
+ .aura-actionbar__status { flex: 1 1 8rem; min-width: 0; font-size: max(14px, .875rem); color: var(--aura-fg-secondary); font-variant-numeric: tabular-nums; }
1970
1988
  .aura-actionbar__status:empty { flex-basis: 0; }
1971
1989
  /* 5.20: an empty status leaves the row (it would still take a gap and push the start slot away from its edge) but
1972
1990
  * stays in the page as a live region, so the next status is announced. */
@@ -2003,8 +2021,8 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2003
2021
  linear-gradient(to left, var(--aura-scroll-shadow), transparent) right / 12px 100% no-repeat scroll,
2004
2022
  var(--aura-tbl-bg, var(--aura-bg-surface));
2005
2023
  }
2006
- .aura-tbl { width: 100%; border-collapse: collapse; border-spacing: 0; font-size: 13px; line-height: 20px; }
2007
- .aura-tbl__caption { caption-side: top; padding: var(--aura-space-4) var(--aura-space-6) var(--aura-space-3); text-align: left; font-size: 14px; font-weight: 600; }
2024
+ .aura-tbl { width: 100%; border-collapse: collapse; border-spacing: 0; font-size: max(13px, .8125rem); line-height: max(20px, 1.25rem); }
2025
+ .aura-tbl__caption { caption-side: top; padding: var(--aura-space-4) var(--aura-space-6) var(--aura-space-3); text-align: left; font-size: max(14px, .875rem); font-weight: 600; }
2008
2026
  /* 5.30: from 640px a cell is at least 10ch wide, so the table never squeezes a column to one letter; a longer word (an
2009
2027
  * email, a URL) still breaks to fit instead of widening the table. Phones keep fitting the box: use stackBelow there. */
2010
2028
  .aura-tbl__th, .aura-tbl__td { padding: var(--aura-tbl-cell-py, var(--aura-space-3)) var(--aura-space-4); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
@@ -2013,14 +2031,14 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2013
2031
  .aura-tbl__th:last-child, .aura-tbl__td:last-child { padding-right: var(--aura-space-6); }
2014
2032
  .aura-tbl__head .aura-tbl__th {
2015
2033
  background: var(--aura-table-head-bg); border-bottom: 1px solid var(--aura-border-default);
2016
- font-family: var(--font-mono); font-size: 12px; font-weight: 400; color: var(--aura-fg-secondary); white-space: nowrap;
2034
+ font-family: var(--font-mono); font-size: max(12px, .75rem); font-weight: 400; color: var(--aura-fg-secondary); white-space: nowrap;
2017
2035
  }
2018
2036
  .aura-tbl__body .aura-tbl__row + .aura-tbl__row > * { border-top: 1px solid var(--aura-border-default); }
2019
2037
  .aura-tbl__body .aura-tbl__th { font-weight: 500; }
2020
2038
  .aura-tbl__foot > .aura-tbl__row > * { background: var(--aura-table-head-bg); font-weight: 600; }
2021
2039
  .aura-tbl__foot > .aura-tbl__row:first-child > * { border-top: 2px solid var(--aura-border-default); }
2022
2040
  /* 5.30: with several totals rows (Subtotal, VAT, Total) the last one reads as the total. */
2023
- .aura-tbl__foot > .aura-tbl__row:last-child:not(:first-child) > * { font-size: 14px; font-weight: 700; }
2041
+ .aura-tbl__foot > .aura-tbl__row:last-child:not(:first-child) > * { font-size: max(14px, .875rem); font-weight: 700; }
2024
2042
  .aura-tbl__foot > .aura-tbl__row + .aura-tbl__row > * { border-top: 1px solid var(--aura-border-default); }
2025
2043
  .aura-tbl .is-end { text-align: right; }
2026
2044
  .aura-tbl .is-center { text-align: center; }
@@ -2069,18 +2087,18 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2069
2087
  .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row + .aura-tbl__row, .aura-tbl--stack-md > .aura-tbl__foot > .aura-tbl__row:first-child { border-top: 1px solid var(--aura-border-default); }
2070
2088
  .aura-tbl--stack-md > * > .aura-tbl__row > .aura-tbl__th, .aura-tbl--stack-md > * > .aura-tbl__row > .aura-tbl__td { padding: 0; border-top: 0; background: none; text-align: start; white-space: normal; }
2071
2089
  .aura-tbl--stack-md > * > .aura-tbl__row > * + * { margin-top: var(--aura-space-2); }
2072
- .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row > .aura-tbl__th { font-size: 14px; font-weight: 600; }
2090
+ .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row > .aura-tbl__th { font-size: max(14px, .875rem); font-weight: 600; }
2073
2091
  /* 5.13 (Chamber-OS 84): a row with a title or action cell — title and action share the first line, fields two to a line under them. */
2074
2092
  .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) { display: flex; flex-wrap: wrap; align-items: flex-start; column-gap: var(--aura-space-4); }
2075
2093
  .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card])::after { content: ''; order: 3; flex: 0 0 100%; }
2076
2094
  .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > * { order: 4; flex: 0 0 calc(50% - var(--aura-space-4) / 2); min-width: 0; margin-top: var(--aura-space-2); }
2077
2095
  .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card] { margin-top: 0; }
2078
- .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card='title'] { order: 1; flex: 1 1 0; font-size: 14px; font-weight: 600; }
2096
+ .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card='title'] { order: 1; flex: 1 1 0; font-size: max(14px, .875rem); font-weight: 600; }
2079
2097
  .aura-tbl--stack-md > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card='action'] { order: 2; flex: none; margin-inline-start: auto; }
2080
2098
  .aura-tbl-wrap.is-flush > .aura-tbl--stack-md > .aura-tbl__caption { padding-inline: var(--aura-space-4); }
2081
2099
  .aura-tbl--stack-md > * > .aura-tbl__row > .aura-tbl__td[data-label]::before {
2082
2100
  content: attr(data-label); content: attr(data-label) / '';
2083
- display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 400; color: var(--aura-fg-secondary);
2101
+ display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: max(11px, .6875rem); line-height: max(16px, 1rem); font-weight: 400; color: var(--aura-fg-secondary);
2084
2102
  }
2085
2103
  /* 5.26: a bleeding list keeps its rows' text level with the Card's content (16px where it doesn't bleed). */
2086
2104
  .aura-card__body .aura-bleed.aura-bleed-frame > .aura-tbl--stack-md:not(.aura-tbl--cards) > * > .aura-tbl__row, .aura-card__body .aura-bleed > .aura-bleed-frame > .aura-tbl--stack-md:not(.aura-tbl--cards) > * > .aura-tbl__row { padding-inline: max(var(--aura-card-bleed), var(--aura-space-4) - var(--aura-card-bleed) * 1000); }
@@ -2093,18 +2111,18 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2093
2111
  .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row + .aura-tbl__row, .aura-tbl--stack-sm > .aura-tbl__foot > .aura-tbl__row:first-child { border-top: 1px solid var(--aura-border-default); }
2094
2112
  .aura-tbl--stack-sm > * > .aura-tbl__row > .aura-tbl__th, .aura-tbl--stack-sm > * > .aura-tbl__row > .aura-tbl__td { padding: 0; border-top: 0; background: none; text-align: start; white-space: normal; }
2095
2113
  .aura-tbl--stack-sm > * > .aura-tbl__row > * + * { margin-top: var(--aura-space-2); }
2096
- .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row > .aura-tbl__th { font-size: 14px; font-weight: 600; }
2114
+ .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row > .aura-tbl__th { font-size: max(14px, .875rem); font-weight: 600; }
2097
2115
  /* 5.13 (Chamber-OS 84): a row with a title or action cell — title and action share the first line, fields two to a line under them. */
2098
2116
  .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) { display: flex; flex-wrap: wrap; align-items: flex-start; column-gap: var(--aura-space-4); }
2099
2117
  .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card])::after { content: ''; order: 3; flex: 0 0 100%; }
2100
2118
  .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > * { order: 4; flex: 0 0 calc(50% - var(--aura-space-4) / 2); min-width: 0; margin-top: var(--aura-space-2); }
2101
2119
  .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card] { margin-top: 0; }
2102
- .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card='title'] { order: 1; flex: 1 1 0; font-size: 14px; font-weight: 600; }
2120
+ .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card='title'] { order: 1; flex: 1 1 0; font-size: max(14px, .875rem); font-weight: 600; }
2103
2121
  .aura-tbl--stack-sm > .aura-tbl__body > .aura-tbl__row:has(> [data-card]) > [data-card='action'] { order: 2; flex: none; margin-inline-start: auto; }
2104
2122
  .aura-tbl-wrap.is-flush > .aura-tbl--stack-sm > .aura-tbl__caption { padding-inline: var(--aura-space-4); }
2105
2123
  .aura-tbl--stack-sm > * > .aura-tbl__row > .aura-tbl__td[data-label]::before {
2106
2124
  content: attr(data-label); content: attr(data-label) / '';
2107
- display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 400; color: var(--aura-fg-secondary);
2125
+ display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: max(11px, .6875rem); line-height: max(16px, 1rem); font-weight: 400; color: var(--aura-fg-secondary);
2108
2126
  }
2109
2127
  /* 5.26: a bleeding list keeps its rows' text level with the Card's content (16px where it doesn't bleed). */
2110
2128
  .aura-card__body .aura-bleed.aura-bleed-frame > .aura-tbl--stack-sm:not(.aura-tbl--cards) > * > .aura-tbl__row, .aura-card__body .aura-bleed > .aura-bleed-frame > .aura-tbl--stack-sm:not(.aura-tbl--cards) > * > .aura-tbl__row { padding-inline: max(var(--aura-card-bleed), var(--aura-space-4) - var(--aura-card-bleed) * 1000); }
@@ -2167,7 +2185,7 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2167
2185
  .aura-table__picker { display: none; }
2168
2186
  .aura-table__head {
2169
2187
  position: static; height: auto; min-width: 0; padding: 0 0 var(--aura-space-3); border: 0; background: none;
2170
- font-family: var(--font-sans); font-size: 13px;
2188
+ font-family: var(--font-sans); font-size: max(13px, .8125rem);
2171
2189
  }
2172
2190
  .aura-table__head > .aura-table__th {
2173
2191
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
@@ -2207,16 +2225,16 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2207
2225
  .aura-table__td[data-label]::before {
2208
2226
  content: attr(data-label); content: attr(data-label) / '';
2209
2227
  display: block; margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: start;
2210
- font-family: var(--font-mono); font-size: 11px; line-height: normal; font-weight: 400; color: var(--aura-fg-secondary);
2228
+ font-family: var(--font-mono); font-size: max(11px, .6875rem); line-height: normal; font-weight: 400; color: var(--aura-fg-secondary);
2211
2229
  }
2212
2230
  .aura-table__td[data-card='title'], .aura-table__td[data-card='pill'], .aura-table__td[data-card='actions'] { align-self: center; margin-bottom: 0; }
2213
- .aura-table__td[data-card='title'] { order: 1; flex: 1 1 0; font-size: 14px; font-weight: 600; }
2231
+ .aura-table__td[data-card='title'] { order: 1; flex: 1 1 0; font-size: max(14px, .875rem); font-weight: 600; }
2214
2232
  .aura-table__td[data-card='pill'] { order: 2; flex: none; }
2215
2233
  .aura-table__td[data-card='actions'] { order: 3; flex: none; margin: calc(-1 * var(--aura-space-1)) calc(-1 * var(--aura-space-2)) calc(-1 * var(--aura-space-1)) 0; }
2216
2234
  /* 5.22 (Chamber-OS 119): the title wraps rather than being cut — a member's full name before a one-click action —
2217
2235
  * and the row box and the pill line up with its first line (a 20px line; the 16px box 2px down). */
2218
- .aura-table__td[data-card='title'] { white-space: normal; overflow-wrap: anywhere; overflow: visible; line-height: 20px; align-self: flex-start; }
2219
- .aura-table__td[data-card='pill'] { align-self: flex-start; line-height: 20px; }
2236
+ .aura-table__td[data-card='title'] { white-space: normal; overflow-wrap: anywhere; overflow: visible; line-height: max(20px, 1.25rem); align-self: flex-start; }
2237
+ .aura-table__td[data-card='pill'] { align-self: flex-start; line-height: max(20px, 1.25rem); }
2220
2238
  .aura-table__row > .aura-table__sel { align-self: flex-start; margin-top: 2px; }
2221
2239
  /* Actions top-right sit on that first line too (a 32px button centred on 20px, the same 24px footprint as before). */
2222
2240
  .aura-table__td[data-card='actions'] { align-self: flex-start; margin-top: calc(-1 * var(--aura-space-1) - 2px); margin-bottom: -2px; }
@@ -2278,18 +2296,18 @@ button.aura-stepper__step:hover .aura-stepper__label { text-decoration: underlin
2278
2296
 
2279
2297
  /* 5.30: Thai needs more room than Latin — tone marks and vowels stack above and below the line. Where the page or a
2280
2298
  * part of it is Thai (lang="th"), small labels are at least 12px and lines are taller. */
2281
- .aura-pill:lang(th), .aura-badge:lang(th), .aura-tab__count:lang(th) { font-size: 12px; }
2282
- .aura-pill:lang(th) { line-height: 18px; }
2299
+ .aura-pill:lang(th), .aura-badge:lang(th), .aura-tab__count:lang(th) { font-size: max(12px, .75rem); }
2300
+ .aura-pill:lang(th) { line-height: max(18px, 1.125rem); }
2283
2301
  .aura-skel--pill:lang(th) { height: 22px; } /* the loading pill stays as tall as the Thai one */
2284
- .aura-bottomnav__item:lang(th) { font-size: 12px; line-height: 18px; }
2285
- .aura-stepper__desc:lang(th) { font-size: 13px; line-height: 1.6; }
2286
- .aura-nav__label:lang(th) { line-height: 22px; }
2302
+ .aura-bottomnav__item:lang(th) { font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); }
2303
+ .aura-stepper__desc:lang(th) { font-size: max(13px, .8125rem); line-height: 1.6; }
2304
+ .aura-nav__label:lang(th) { line-height: max(22px, 1.375rem); }
2287
2305
  /* 5.30 (audit D): field labels, hints and errors and choice descriptions get Thai line room; a stacked card's field
2288
2306
  * labels are 12px in the sans face (the mono face has no Thai), and a stacked DataTable card's values sit on a set
2289
2307
  * 1.6 line, so a loading card (its bars follow 1lh) is as tall as one with Thai text. */
2290
2308
  .aura-field__label:lang(th), .aura-field__hint:lang(th), .aura-field__error:lang(th), .aura-field__addon:lang(th) { line-height: 1.6; }
2291
- .aura-choice__desc:lang(th), .aura-check__desc:lang(th) { font-size: 13px; line-height: 1.6; }
2292
- .aura-tbl__row > .aura-tbl__td[data-label]:lang(th)::before, .aura-table__td[data-label]:lang(th)::before { font-family: var(--font-sans); font-size: 12px; line-height: 18px; }
2309
+ .aura-choice__desc:lang(th), .aura-check__desc:lang(th) { font-size: max(13px, .8125rem); line-height: 1.6; }
2310
+ .aura-tbl__row > .aura-tbl__td[data-label]:lang(th)::before, .aura-table__td[data-label]:lang(th)::before { font-family: var(--font-sans); font-size: max(12px, .75rem); line-height: max(18px, 1.125rem); }
2293
2311
  .aura-table--stacked .aura-table__td[data-label]:lang(th) { line-height: 1.6; }
2294
2312
 
2295
2313
  /* 5.30: a plain link (no class) inside AURA's surfaces takes the accent colour instead of the browser's blue. Zero