/* bloom — restyles seenry-ui. Load after seenry-ui.css and tokens.css. Every value comes from tokens.css. */

body{background:var(--bg);color:var(--text);font:var(--type-body);font-feature-settings:"ss01","cv11"}
h1,h2,h3{font-weight:600;letter-spacing:var(--track-snug)}
::selection{background:var(--accent-subtle);color:var(--text)}
:focus-visible{outline:var(--ring) solid var(--accent);outline-offset:var(--ring)}
[class^="ph-"],[class*=" ph-"]{font-size:var(--icon);line-height:1;flex:none}
button{border-radius:var(--r-sm)}

/* Buttons */
.ui-button{--button-h:var(--control-h);gap:var(--space-2);padding:0 var(--space-4);border:var(--hairline) solid var(--line-strong);border-radius:var(--r-md);background:var(--surface);color:var(--text);font:var(--type-label);font-weight:600;box-shadow:var(--shadow-card)}
.ui-button:not([data-size=sm]){font:var(--type-label);font-weight:600}
.ui-button:hover:not(:disabled){background:var(--hover)}
.ui-button[data-size=sm]{--button-h:var(--control-sm);padding-inline:var(--space-3);font:var(--type-small);font-weight:600;border-radius:var(--r-sm)}
.ui-button[data-size=lg]{--button-h:var(--control-lg);padding-inline:var(--space-5);border-radius:var(--r-md)}
.ui-button[data-variant=primary]{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:none}
.ui-button[data-variant=primary]:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}
.ui-button[data-variant=ghost]{background:transparent;border-color:transparent;box-shadow:none;color:var(--text-2)}
.ui-button[data-variant=ghost]:hover:not(:disabled){background:var(--hover);color:var(--text)}
.ui-button[data-variant=danger]{background:var(--surface);border-color:color-mix(in oklab,var(--bad) 40%,var(--line));color:var(--bad)}
.ui-button[data-variant=danger]:hover:not(:disabled){background:var(--bad-bg);filter:none}
.ui-button[data-icon]{width:var(--button-h);padding:0}
.ui-button i{font-size:var(--icon)}
.ui-button[data-size=sm] i{font-size:var(--icon-sm)}
.ui-button svg{width:var(--icon);height:var(--icon)}
.ui-button[data-loading]::before{width:var(--icon-sm);height:var(--icon-sm);border-width:var(--ring)}
.ui-button .ui-kbd{margin-left:var(--space-1)}

/* Fields */
.ui-field{gap:var(--space-2)}
.ui-label{font:var(--type-label);color:var(--text)}
.ui-help,.ui-error{font:var(--type-small);color:var(--text-3)}
.ui-error{color:var(--bad)}
.ui-input,.ui-textarea,.ui-select{min-height:var(--control-h);padding:var(--space-2) var(--space-3);border:var(--hairline) solid var(--line-strong);border-radius:var(--r-md);background-color:var(--surface);font:var(--type-body);color:var(--text)}
.ui-input:hover:not(:disabled),.ui-textarea:hover:not(:disabled),.ui-select:hover:not(:disabled){border-color:var(--text-3)}
.ui-input:focus,.ui-textarea:focus,.ui-select:focus{border-color:var(--accent);box-shadow:var(--focus)}
.ui-input::placeholder,.ui-textarea::placeholder{color:var(--text-3)}
.ui-field[data-invalid] .ui-input:focus,.ui-field[data-invalid] .ui-textarea:focus,.ui-field[data-invalid] .ui-select:focus{box-shadow:0 0 0 var(--edge) var(--bad-bg)}
.ui-textarea{min-height:calc(var(--control-h) * 3)}
.ui-select{padding-right:var(--space-7);background-position:right var(--space-3) center}
.ui-affix{color:var(--text-3);font:var(--type-body);display:inline-flex}
.ui-affix:first-child{left:var(--space-3)}
.ui-affix:last-child{right:var(--space-3)}
.ui-affix:first-child+.ui-input{padding-left:calc(var(--space-3) + var(--icon) + var(--space-2))}
.ui-input:has(+.ui-affix){padding-right:var(--space-7)}

.ui-choice{gap:var(--space-3);min-height:var(--control-h);padding:var(--space-2) 0;font:var(--type-body);color:var(--text)}
.ui-choice input{width:var(--check);height:var(--check);margin:calc(var(--space-1) / 2) 0;border:var(--hairline) solid var(--line-strong);border-radius:calc(var(--r-sm) / 2);background:var(--surface)}
.ui-choice input[type=radio]{border-radius:50%}
.ui-choice input:checked{background-color:var(--accent);border-color:var(--accent)}
.ui-choice input[type=radio]:checked{background:var(--surface);box-shadow:inset 0 0 0 var(--space-1) var(--accent)}
.ui-choice input:focus-visible{outline:var(--ring) solid var(--accent);outline-offset:var(--ring)}
.ui-choice small{font:var(--type-small);color:var(--text-3)}
.ui-radio-group{gap:var(--space-1)}
.ui-radio-group legend{padding-bottom:var(--space-2);font:var(--type-label)}

.ui-switch{gap:var(--space-3);min-height:var(--control-h);font:var(--type-body)}
.ui-switch input{width:var(--switch-w);height:var(--switch-h);border:0;border-radius:var(--r-pill);background:var(--line-strong)}
.ui-switch input::after{top:var(--knob-gap);left:var(--knob-gap);width:var(--knob);height:var(--knob);background:var(--on-accent);box-shadow:var(--shadow-thumb)}
.ui-switch input:checked{background:var(--accent)}
.ui-switch input:checked::after{transform:translateX(calc(var(--switch-w) - var(--knob) - var(--knob-gap) * 2))}
.ui-switch input:focus-visible{outline:var(--ring) solid var(--accent);outline-offset:var(--ring)}

/* Selection and navigation */
.ui-segmented{gap:calc(var(--space-1) / 2);padding:calc(var(--space-1) - var(--hairline));border:var(--hairline) solid var(--line);border-radius:var(--r-pill);background:var(--surface-2)}
.ui-segmented button{gap:var(--space-2);min-height:calc(var(--control-h) - var(--space-2));padding:0 var(--space-3);border-radius:var(--r-pill);font:var(--type-label);color:var(--text-2);transition:background-color var(--t-base) var(--ease-out),color var(--t-fast)}
.ui-segmented button:hover{background:transparent;color:var(--text)}
.ui-segmented button[aria-pressed=true]{background:var(--surface);color:var(--text);font-weight:600;box-shadow:var(--shadow-thumb)}
[data-theme=dark] .ui-segmented button[aria-pressed=true]{background:var(--hover)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ui-segmented button[aria-pressed=true]{background:var(--hover)}}

.ui-tabs{gap:var(--space-6);border-bottom:var(--hairline) solid var(--line)}
.ui-tabs [role=tab]{min-height:var(--control-lg);padding:0 var(--space-1);font:var(--type-label);color:var(--text-3)}
.ui-tabs [role=tab][aria-selected=true]{color:var(--text);font-weight:600}
.ui-tab-indicator{height:var(--ring);bottom:calc(var(--hairline) * -1);border-radius:var(--r-pill);background:var(--accent)}
.ui-tab-panel{padding-top:var(--space-5)}

.ui-breadcrumb{gap:var(--space-2);font:var(--type-label);color:var(--text-3);flex-wrap:nowrap;min-width:0}
.ui-breadcrumb li{white-space:nowrap}
.ui-breadcrumb li+li::before{margin-right:var(--space-2);color:var(--line-strong)}
.ui-breadcrumb [aria-current=page]{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis}
.ui-kbd{min-width:calc(var(--space-5) + var(--space-1));padding:0 var(--space-1);border:var(--hairline) solid var(--line);border-radius:calc(var(--r-sm) / 2);background:var(--surface-2);color:var(--text-3);font:var(--type-small);font-weight:500;box-shadow:none}

/* Floating layers */
.ui-menu,.ui-tooltip,[data-ui=popover]{min-width:var(--menu-min);padding:var(--space-1);border:var(--hairline) solid var(--line);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-float)}
.ui-menu [role=menuitem],.ui-menu [role=menuitemcheckbox]{gap:var(--space-3);min-height:var(--control-h);padding:var(--space-2) var(--space-3);border-radius:var(--r-sm);font:var(--type-body)}
.ui-menu [role=menuitem] i,.ui-menu [role=menuitemcheckbox] i{color:var(--text-3)}
.ui-menu hr{height:var(--hairline);margin:var(--space-1) calc(var(--space-1) * -1)}
.ui-menu kbd{font:var(--type-small);color:var(--text-3)}
.ui-tooltip{min-width:0;max-width:calc(var(--menu-min) + var(--space-5));padding:var(--space-1) var(--space-2);border-color:transparent;border-radius:var(--r-sm);background:var(--text);color:var(--surface);font:var(--type-small)}

.ui-dialog,.ui-sheet,.ui-command{width:min(var(--dialog-w),calc(100vw - var(--space-7)));border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-float)}
.ui-dialog::backdrop,.ui-sheet::backdrop,.ui-command::backdrop{background:var(--scrim)}
.ui-dialog__head,.ui-dialog__body,.ui-dialog__foot{padding:var(--space-5) var(--space-6)}
.ui-dialog__head{padding-bottom:0}
.ui-dialog__head h2{font:var(--type-subtitle)}
.ui-dialog__body{font:var(--type-body);color:var(--text-2)}
.ui-dialog__foot{gap:var(--space-2);padding-top:0}
.ui-sheet{width:min(var(--sheet-w),100vw);border-radius:var(--r-lg) 0 0 var(--r-lg)}
.ui-sheet__content{padding:var(--space-6)}
.ui-sheet__content h2{margin-bottom:var(--space-4);font:var(--type-subtitle)}

.ui-toast-stack{right:var(--space-6);bottom:var(--space-6);gap:var(--space-2)}
.ui-toast{gap:var(--space-3);padding:var(--space-3) var(--space-4);border:var(--hairline) solid var(--line);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-float);font:var(--type-body)}
.ui-toast strong{font-weight:600}
.ui-toast p{font:var(--type-small);color:var(--text-2)}
.ui-toast button{font:var(--type-heading);color:var(--text-3)}

.ui-accordion{border-top:var(--hairline) solid var(--line)}
.ui-accordion:last-child{border-bottom:var(--hairline) solid var(--line)}
.ui-accordion summary{gap:var(--space-4);min-height:var(--control-lg);font:var(--type-label);font-weight:600}
.ui-accordion summary::after{font:var(--type-heading);color:var(--text-3)}
.ui-accordion__body{padding-bottom:var(--space-4);font:var(--type-body);color:var(--text-2)}

/* Badges are category chips; status is a word with a mark */
.ui-badge{gap:var(--space-1);min-height:calc(var(--space-6) - var(--space-1) / 2);padding:0 var(--space-2);border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);font:var(--type-small);font-weight:600}
.ui-badge i{font-size:var(--icon-sm)}
.ui-badge[data-cat="1"],.ui-avatar[data-cat="1"]{background:var(--cat-1-bg);color:var(--cat-1)}
.ui-badge[data-cat="2"],.ui-avatar[data-cat="2"]{background:var(--cat-2-bg);color:var(--cat-2)}
.ui-badge[data-cat="3"],.ui-avatar[data-cat="3"]{background:var(--cat-3-bg);color:var(--cat-3)}
.ui-badge[data-cat="4"],.ui-avatar[data-cat="4"]{background:var(--cat-4-bg);color:var(--cat-4)}
.ui-badge[data-cat="5"],.ui-avatar[data-cat="5"]{background:var(--cat-5-bg);color:var(--cat-5)}
.ui-badge[data-tone=ok]{background:var(--ok-bg);color:var(--ok)}
.ui-badge[data-tone=warn]{background:var(--warn-bg);color:var(--warn)}
.ui-badge[data-tone=bad]{background:var(--bad-bg);color:var(--bad)}
.ui-badge[data-tone=info]{background:var(--info-bg);color:var(--info)}

.ui-status{gap:var(--space-2);min-height:0;padding:0;border-radius:0;background:transparent;color:var(--text);font:var(--type-label);font-weight:500}
.ui-status>i{font-size:var(--icon-sm)}
.ui-status:has(>i)::before{display:none}
.ui-status[data-status=ok]>i{color:var(--ok)}
.ui-status[data-status=warn]>i{color:var(--warn)}
.ui-status[data-status=bad]>i{color:var(--bad)}
.ui-status[data-status=info]>i{color:var(--info)}
.ui-status[data-status=idle]>i{color:var(--text-3)}
.ui-status::before{content:"";flex:none;width:var(--mark);height:var(--mark);border-radius:50%;background:var(--line-strong)}
.ui-status[data-status=ok],.ui-status[data-tone=ok]{background:transparent;color:var(--text)}
.ui-status[data-status=ok]::before,.ui-status[data-tone=ok]::before{background:var(--ok)}
.ui-status[data-status=warn],.ui-status[data-tone=warn]{background:transparent;color:var(--text)}
.ui-status[data-status=warn]::before,.ui-status[data-tone=warn]::before{background:var(--warn)}
.ui-status[data-status=bad],.ui-status[data-tone=bad]{background:transparent;color:var(--text)}
.ui-status[data-status=bad]::before,.ui-status[data-tone=bad]::before{background:var(--bad)}
.ui-status[data-status=info],.ui-status[data-tone=info]{background:transparent;color:var(--text)}
.ui-status[data-status=info]::before,.ui-status[data-tone=info]::before{background:var(--info)}
.ui-status[data-status=idle]{color:var(--text-3)}
.ui-status[data-status=idle]::before{background:transparent;box-shadow:inset 0 0 0 var(--ring) var(--line-strong)}

/* Category mark: the dot, edge and swatch of the five hues */
.ui-mark{display:inline-block;flex:none;width:var(--mark);height:var(--mark);border-radius:50%;background:var(--line-strong)}
.ui-mark[data-shape=square]{width:var(--mark-lg);height:var(--mark-lg);border-radius:calc(var(--r-sm) / 3)}
.ui-mark[data-cat="1"]{background:var(--cat-1-mark)}
.ui-mark[data-cat="2"]{background:var(--cat-2-mark)}
.ui-mark[data-cat="3"]{background:var(--cat-3-mark)}
.ui-mark[data-cat="4"]{background:var(--cat-4-mark)}
.ui-mark[data-cat="5"]{background:var(--cat-5-mark)}
.ui-mark[data-cat=accent]{background:var(--chart-1)}
.ui-mark[data-cat=muted]{background:var(--chart-muted)}
.ui-mark[data-cat=empty]{background:var(--chart-grid)}

.ui-avatar{width:var(--avatar);height:var(--avatar);border:0;background:var(--accent-subtle);color:var(--accent-ink);font:var(--type-small);font-weight:700;letter-spacing:var(--track-snug)}
.ui-avatar[data-size=sm]{width:var(--avatar-sm);height:var(--avatar-sm);font-size:calc(var(--avatar-sm) * .42)}
.ui-avatar[data-size=lg]{width:var(--avatar-lg);height:var(--avatar-lg);font:var(--type-label);font-weight:700}
.ui-avatar[data-shape=square]{border-radius:var(--r-sm)}
.ui-avatar-group{padding-left:var(--space-1)}
.ui-avatar-group .ui-avatar{margin-left:calc(var(--space-1) * -1);box-shadow:0 0 0 var(--avatar-ring) var(--surface)}

.ui-chip{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--control-sm);padding:0 var(--space-3);border:var(--hairline) solid var(--line);border-radius:var(--r-pill);background:var(--surface);color:var(--text-2);font:var(--type-label);white-space:nowrap;transition:background-color var(--t-fast),border-color var(--t-fast),color var(--t-fast)}
.ui-chip:hover{border-color:var(--line-strong);color:var(--text)}
.ui-chip[aria-pressed=true]{border-color:var(--accent);background:var(--accent-subtle);color:var(--accent-ink);font-weight:600}
.ui-chip:disabled{opacity:.5;cursor:not-allowed}
.ui-chip small{font:var(--type-small);color:var(--text-3);font-variant-numeric:tabular-nums}
.ui-chip[aria-pressed=true] small{color:var(--accent-ink)}
.ui-chip i{font-size:var(--icon-sm)}

/* Cards, stats, tables */
.ui-card{padding:var(--space-5);border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-card)}
.ui-card h3{font:var(--type-heading)}
.ui-card p{margin-top:var(--space-1);font:var(--type-body);color:var(--text-2)}
.ui-card[data-link]:hover{border-color:var(--line-strong);background:var(--surface)}

.ui-stat-strip{border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-card)}
.ui-stat{padding:var(--space-5) var(--space-6);margin:0}
.ui-stat+.ui-stat{border-left:var(--hairline) solid var(--line)}
.ui-stat dt{display:flex;align-items:center;gap:var(--space-2);font:var(--type-label);color:var(--text-2)}
.ui-stat dt i{color:var(--text-3)}
.ui-stat dd{margin:var(--space-2) 0 var(--space-1);font:var(--type-stat);letter-spacing:var(--track-tight)}
.ui-stat small{font:var(--type-small);color:var(--text-3)}
.ui-stat small b{font-weight:600;color:var(--ok)}

.ui-table-wrap{border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.ui-table th{height:calc(var(--row-h) - var(--space-3));padding:0 var(--space-4);border-bottom:var(--hairline) solid var(--line);background:var(--surface);color:var(--text-3);font:var(--type-small);font-weight:600}
.ui-table th button{gap:var(--space-1);padding:var(--space-1) 0}
.ui-table td{height:var(--row-h);padding:0 var(--space-4);border-bottom:var(--hairline) solid var(--line);font:var(--type-body);color:var(--text-2)}
.ui-table td:first-child{color:var(--text);font-weight:600}
.ui-table tbody tr:hover td{background:var(--bg)}
.ui-table td .ui-status,.ui-table td .ui-badge{vertical-align:middle}
.ui-progress[data-cat="1"]>progress::-webkit-progress-value{background:var(--cat-1-mark)}
.ui-progress[data-cat="2"]>progress::-webkit-progress-value{background:var(--cat-2-mark)}
.ui-progress[data-cat="3"]>progress::-webkit-progress-value{background:var(--cat-3-mark)}
.ui-progress[data-cat="4"]>progress::-webkit-progress-value{background:var(--cat-4-mark)}
.ui-progress[data-cat="5"]>progress::-webkit-progress-value{background:var(--cat-5-mark)}
.ui-progress[data-cat="1"]>progress::-moz-progress-bar{background:var(--cat-1-mark)}
.ui-progress[data-cat="2"]>progress::-moz-progress-bar{background:var(--cat-2-mark)}
.ui-progress[data-cat="3"]>progress::-moz-progress-bar{background:var(--cat-3-mark)}
.ui-progress[data-cat="4"]>progress::-moz-progress-bar{background:var(--cat-4-mark)}
.ui-progress[data-cat="5"]>progress::-moz-progress-bar{background:var(--cat-5-mark)}
.ui-table :is(.ui-progress,.ui-meter){width:calc(var(--space-8) * 3)}
.ui-pagination{gap:var(--space-1)}
.ui-pagination button{min-width:var(--control-h);height:var(--control-h);border-radius:var(--r-pill);font:var(--type-label);color:var(--text-2)}
.ui-pagination button[aria-current=page]{border-color:transparent;background:var(--accent-subtle);color:var(--accent-ink);font-weight:600}

.ui-empty{gap:var(--space-2);padding:var(--space-8) var(--space-6)}
.ui-empty h3{font:var(--type-heading)}
.ui-empty p{max-width:var(--measure);font:var(--type-body);color:var(--text-2)}
.ui-empty .ui-button{margin-top:var(--space-2)}

.ui-skeleton{height:var(--space-4);border-radius:var(--r-pill);background:var(--surface-2);animation:bloom-pulse var(--t-pulse) var(--ease-in-out) infinite alternate}
@keyframes bloom-pulse{to{opacity:.5}}

.ui-command{width:min(calc(var(--dialog-w) + var(--space-8) * 2),calc(100vw - var(--space-7)))}
.ui-command input{height:calc(var(--control-lg) + var(--space-2));padding:0 var(--space-5);border-bottom:var(--hairline) solid var(--line);font:var(--type-heading);font-weight:500}
.ui-command__list{padding:var(--space-2)}
.ui-command__list button{gap:var(--space-3);min-height:var(--control-h);padding:var(--space-2) var(--space-3);border-radius:var(--r-sm);font:var(--type-body)}
.ui-command__list button i{color:var(--text-3)}
.ui-command__list button[data-active=false]{background:transparent}
.ui-command__list button[data-active=false]:hover{background:var(--hover)}
.ui-command__list button[data-active=true]{background:var(--accent-subtle);color:var(--accent-ink)}
.ui-command__list button[data-active=true] i{color:var(--accent-ink)}
.ui-command__empty{padding:var(--space-5) var(--space-3);font:var(--type-body)}
.ui-command__footer{padding:var(--space-3) var(--space-5);border-top:var(--hairline) solid var(--line);font:var(--type-small)}

/* Progress (work done) and meter (usage against a limit): the bar plus its number */
.ui-progress,.ui-meter{display:flex;align-items:center;gap:var(--space-3);min-width:0}
:is(progress.ui-progress,.ui-progress>progress,meter.ui-meter,.ui-meter>meter){display:block;flex:1;appearance:none;width:100%;min-width:var(--space-8);height:var(--progress-h);border:0;border-radius:var(--r-pill);background:var(--surface-2);overflow:hidden;color:var(--text)}
:is(progress.ui-progress,.ui-progress>progress)::-webkit-progress-bar{background:var(--surface-2);border-radius:var(--r-pill)}
:is(progress.ui-progress,.ui-progress>progress)::-webkit-progress-value{background:var(--accent);border-radius:var(--r-pill);transition:inline-size var(--t-layer) var(--ease-out)}
:is(progress.ui-progress,.ui-progress>progress)::-moz-progress-bar{background:var(--accent);border-radius:var(--r-pill)}
:is(progress.ui-progress,.ui-progress>progress):indeterminate{background:var(--accent-subtle);animation:bloom-pulse var(--t-pulse) var(--ease-in-out) infinite alternate}
:is(progress.ui-progress,.ui-progress>progress):indeterminate::-webkit-progress-bar{background:var(--accent-subtle)}
:is(meter.ui-meter,.ui-meter>meter)::-webkit-meter-bar{height:var(--progress-h);border:0;border-radius:var(--r-pill);background:var(--surface-2)}
:is(meter.ui-meter,.ui-meter>meter)::-webkit-meter-optimum-value{background:var(--accent);border-radius:var(--r-pill)}
:is(meter.ui-meter,.ui-meter>meter)::-webkit-meter-suboptimum-value{background:var(--warn-fill);border-radius:var(--r-pill)}
:is(meter.ui-meter,.ui-meter>meter)::-webkit-meter-even-less-good-value{background:var(--bad-fill);border-radius:var(--r-pill)}
:is(meter.ui-meter,.ui-meter>meter):-moz-meter-optimum::-moz-meter-bar{background:var(--accent)}
:is(meter.ui-meter,.ui-meter>meter):-moz-meter-sub-optimum::-moz-meter-bar{background:var(--warn-fill)}
:is(meter.ui-meter,.ui-meter>meter):-moz-meter-sub-sub-optimum::-moz-meter-bar{background:var(--bad-fill)}
:is(.ui-progress,.ui-meter)>:is(output,b,span){flex:none;min-width:calc(var(--space-7) + var(--space-2));font:var(--type-label);font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
:is(.ui-progress,.ui-meter)>:is(output,b,span) small{font:var(--type-small);color:var(--text-3)}

/* Alert: icon, one sentence, an optional action */
.ui-alert{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:var(--hairline) solid color-mix(in oklab,var(--info) 20%,var(--line));border-radius:var(--r-md);background:var(--info-bg);color:var(--text);font:var(--type-body)}
.ui-alert>i{flex:none;margin-top:var(--hairline);font-size:var(--icon-lg);color:var(--info)}
.ui-alert>:is(p,div){flex:1;min-width:0}
.ui-alert strong{font-weight:600}
.ui-alert>:is(.ui-button,a){flex:none;align-self:center}
.ui-alert>a{font:var(--type-label);font-weight:600;color:var(--text);text-decoration:underline;text-underline-offset:var(--edge)}
.ui-alert[data-status=ok]{border-color:color-mix(in oklab,var(--ok) 20%,var(--line));background:var(--ok-bg)}
.ui-alert[data-status=ok]>i{color:var(--ok)}
.ui-alert[data-status=warn]{border-color:color-mix(in oklab,var(--warn) 22%,var(--line));background:var(--warn-bg)}
.ui-alert[data-status=warn]>i{color:var(--warn)}
.ui-alert[data-status=bad]{border-color:color-mix(in oklab,var(--bad) 22%,var(--line));background:var(--bad-bg)}
.ui-alert[data-status=bad]>i{color:var(--bad)}
.ui-alert[data-status=idle]{border-color:var(--line);background:var(--surface-2)}
.ui-alert[data-status=idle]>i{color:var(--text-3)}
.ui-alert .ui-button{background:var(--surface)}

/* Data list: label and value pairs */
.ui-data-list{display:grid;grid-template-columns:var(--detail-label-w) minmax(0,1fr);margin:0;font:var(--type-body)}
.ui-data-list>dt,.ui-data-list>dd{display:flex;align-items:center;gap:var(--space-2);min-width:0;min-height:calc(var(--row-h) - var(--space-2));padding:var(--space-2) 0;border-top:var(--hairline) solid var(--line)}
.ui-data-list>dt{font:var(--type-label);color:var(--text-3)}
.ui-data-list>dt>i{color:var(--text-3)}
.ui-data-list>dd{flex-wrap:wrap;margin:0;padding-left:var(--space-4);color:var(--text)}
.ui-data-list>dt:first-child,.ui-data-list>dt:first-child+dd{border-top:0}
.ui-data-list a{color:var(--accent-ink);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-data-list a:hover{text-decoration:underline}

/* Timeline: who did what, when */
.ui-timeline{display:grid;margin:0;padding:0;list-style:none}
.ui-timeline-item{position:relative;display:grid;grid-template-columns:var(--avatar) minmax(0,1fr);gap:0 var(--space-3);padding-bottom:var(--space-5);font:var(--type-body);color:var(--text-2)}
.ui-timeline-item:last-child{padding-bottom:0}
.ui-timeline-item::before{content:"";position:absolute;top:calc(var(--avatar) + var(--space-1));bottom:var(--space-1);left:calc(var(--avatar) / 2 - var(--hairline) / 2);width:var(--hairline);background:var(--line)}
.ui-timeline-item:last-child::before{display:none}
.ui-timeline-item>:first-child{grid-row:span 2}
.ui-timeline-item>i{display:grid;place-items:center;width:var(--avatar);height:var(--avatar);border-radius:50%;background:var(--surface-2);color:var(--text-2);font-size:var(--icon-sm)}
.ui-timeline-item[data-status=ok]>i{background:var(--ok-bg);color:var(--ok)}
.ui-timeline-item[data-status=warn]>i{background:var(--warn-bg);color:var(--warn)}
.ui-timeline-item[data-status=bad]>i{background:var(--bad-bg);color:var(--bad)}
.ui-timeline-item[data-status=info]>i{background:var(--accent-subtle);color:var(--accent-ink)}
.ui-timeline-item>div{min-width:0;padding-top:calc(var(--space-1) + var(--hairline))}
.ui-timeline-item :is(b,strong){font-weight:600;color:var(--text)}
.ui-timeline-item time{display:block;margin-top:calc(var(--space-1) / 2);font:var(--type-small);color:var(--text-3)}
.ui-timeline-item blockquote{margin:var(--space-2) 0 0;padding:var(--space-2) var(--space-3);border-radius:var(--r-md);background:var(--surface-2);font:var(--type-body);color:var(--text)}

/* Code: inline and a block with a copy button */
code.ui-code,.ui-code code{font-family:var(--font-mono);font-size:.9em}
code.ui-code{padding:calc(var(--space-1) / 2) var(--space-1);border-radius:calc(var(--r-sm) / 2);background:var(--surface-2);color:var(--text)}
div.ui-code,figure.ui-code{position:relative;min-width:0;margin:0;border:var(--hairline) solid var(--line);border-radius:var(--r-md);background:var(--surface-2);overflow:hidden}
.ui-code>header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:var(--control-h);padding:var(--space-1) var(--space-1) var(--space-1) var(--space-4);border-bottom:var(--hairline) solid var(--line);font:var(--type-small);color:var(--text-2)}
.ui-code pre{margin:0;padding:var(--space-3) var(--space-4);overflow-x:auto;font:var(--type-small);font-family:var(--font-mono);color:var(--text);tab-size:2}
.ui-code pre code{font-size:inherit}
.ui-code>[data-copy]{position:absolute;top:var(--space-1);right:var(--space-1)}
.ui-code [data-copy]{color:var(--text-2)}

/* Steps */
.ui-steps{display:flex;align-items:center;gap:var(--space-3);margin:0;padding:0;list-style:none;counter-reset:bloom-step}
.ui-step{display:flex;align-items:center;gap:var(--space-2);min-width:0;font:var(--type-label);color:var(--text-3);counter-increment:bloom-step;white-space:nowrap}
.ui-step::before{content:counter(bloom-step);display:grid;place-items:center;flex:none;width:var(--step);height:var(--step);border:var(--hairline) solid var(--line-strong);border-radius:50%;background:var(--surface);font:var(--type-small);font-weight:700;color:var(--text-2)}
.ui-step:not(:last-child)::after{content:"";flex:1;min-width:var(--space-5);height:var(--hairline);margin-left:var(--space-1);background:var(--line-strong)}
.ui-step:not(:last-child){flex:1}
.ui-step[aria-current=step]{color:var(--text);font-weight:600}
.ui-step[aria-current=step]::before{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}
.ui-step:has(~.ui-step[aria-current=step]){color:var(--text-2)}
.ui-step:has(~.ui-step[aria-current=step])::before{content:"\2713";border-color:var(--accent-subtle);background:var(--accent-subtle);color:var(--accent-ink)}
.ui-step:has(~.ui-step[aria-current=step])::after{background:var(--accent)}
.ui-step>span,.ui-step>a{flex:none}
.ui-step a{color:inherit;text-decoration:none}

/* Slider: native range, its value beside it. --fill (set by seenry-ui.js) carries the filled share. */
.ui-slider{display:flex;align-items:center;gap:var(--space-3);min-width:0}
:is(.ui-slider input[type=range],input[type=range].ui-slider){--fill:50%;flex:1;min-width:0;height:var(--control-h);margin:0;appearance:none;background:transparent;cursor:pointer}
:is(.ui-slider input[type=range],input[type=range].ui-slider)::-webkit-slider-runnable-track{height:var(--progress-h);border-radius:var(--r-pill);background:linear-gradient(var(--accent),var(--accent)) 0 / var(--fill) 100% no-repeat,var(--surface-2)}
:is(.ui-slider input[type=range],input[type=range].ui-slider)::-moz-range-track{height:var(--progress-h);border-radius:var(--r-pill);background:var(--surface-2)}
:is(.ui-slider input[type=range],input[type=range].ui-slider)::-moz-range-progress{height:var(--progress-h);border-radius:var(--r-pill);background:var(--accent)}
:is(.ui-slider input[type=range],input[type=range].ui-slider)::-webkit-slider-thumb{appearance:none;width:var(--thumb);height:var(--thumb);margin-top:calc((var(--progress-h) - var(--thumb)) / 2);border:var(--ring) solid var(--accent);border-radius:50%;background:var(--surface);box-shadow:var(--shadow-thumb);transition:transform var(--t-fast) var(--ease-out)}
:is(.ui-slider input[type=range],input[type=range].ui-slider)::-moz-range-thumb{width:var(--thumb);height:var(--thumb);box-sizing:border-box;border:var(--ring) solid var(--accent);border-radius:50%;background:var(--surface);box-shadow:var(--shadow-thumb)}
:is(.ui-slider input[type=range],input[type=range].ui-slider):hover::-webkit-slider-thumb{transform:scale(1.1)}
:is(.ui-slider input[type=range],input[type=range].ui-slider):focus-visible{outline:0}
:is(.ui-slider input[type=range],input[type=range].ui-slider):focus-visible::-webkit-slider-thumb{box-shadow:var(--focus)}
:is(.ui-slider input[type=range],input[type=range].ui-slider):focus-visible::-moz-range-thumb{box-shadow:var(--focus)}
:is(.ui-slider input[type=range],input[type=range].ui-slider):disabled{cursor:not-allowed;opacity:.5}
.ui-slider>output{flex:none;min-width:calc(var(--space-8) + var(--space-3));padding:var(--space-1) var(--space-2);border:var(--hairline) solid var(--line);border-radius:var(--r-sm);background:var(--surface);font:var(--type-label);font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;text-align:center}

/* Combobox: an input with a datalist, styled like the field, with a caret */
.ui-combobox{position:relative;display:block;min-width:0}
.ui-combobox::after{content:"";position:absolute;top:50%;right:var(--space-3);width:var(--icon-sm);height:var(--icon-sm);background:var(--text-3);pointer-events:none;translate:0 -50%;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat}
:is(.ui-combobox input,input.ui-combobox){width:100%;min-height:var(--control-h);padding:var(--space-2) var(--space-7) var(--space-2) var(--space-3);border:var(--hairline) solid var(--line-strong);border-radius:var(--r-md);background:var(--surface);font:var(--type-body);color:var(--text)}
:is(.ui-combobox input,input.ui-combobox):hover:not(:disabled){border-color:var(--text-3)}
:is(.ui-combobox input,input.ui-combobox):focus{outline:0;border-color:var(--accent);box-shadow:var(--focus)}
:is(.ui-combobox input,input.ui-combobox)::placeholder{color:var(--text-3)}
:is(.ui-combobox input,input.ui-combobox)::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer}
.ui-field[data-invalid] .ui-combobox input{border-color:var(--bad)}

/* Auth: the centered sign-in frame */
.ui-auth{display:grid;align-content:center;justify-items:center;gap:var(--space-5);min-height:100dvh;padding:var(--space-7) var(--gutter);background:var(--bg)}
.ui-auth>section,.ui-auth>form{display:grid;gap:var(--space-5);width:min(var(--auth-w),100%);padding:var(--space-7);border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-card)}
.ui-auth header{display:grid;justify-items:center;gap:var(--space-2);text-align:center}
.ui-auth header .ui-avatar{margin-bottom:var(--space-2)}
.ui-auth h1{font:var(--type-subtitle);letter-spacing:var(--track-snug)}
.ui-auth header p{font:var(--type-body);color:var(--text-2)}
.ui-auth form,.ui-auth fieldset{display:grid;gap:var(--space-4);margin:0;padding:0;border:0}
.ui-auth .ui-button{width:100%}
.ui-auth .ui-button[data-icon]{width:var(--button-h)}
.ui-auth [role=separator]{display:flex;align-items:center;gap:var(--space-3);font:var(--type-small);color:var(--text-3)}
.ui-auth [role=separator]::before,.ui-auth [role=separator]::after{content:"";flex:1;height:var(--hairline);background:var(--line)}
.ui-auth small,.ui-auth>p{font:var(--type-small);color:var(--text-3);text-align:center}
.ui-auth a{color:var(--accent-ink);font-weight:600;text-decoration:none}
.ui-auth a:hover{text-decoration:underline}
.ui-auth small a{font-weight:500;color:var(--text-2);text-decoration:underline;text-underline-offset:var(--edge)}
.ui-auth .ui-tabs{justify-content:center}

/* App shell *//* App shell */
.ui-shell{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);min-height:100dvh;background:var(--bg)}
.ui-shell>main{min-width:0;display:flex;flex-direction:column}
.ui-sidebar{position:sticky;top:0;display:flex;flex-direction:column;gap:var(--space-1);height:100dvh;overflow-y:auto;padding:var(--space-3);border-right:var(--hairline) solid var(--line);background:var(--bg)}
.ui-sidebar-head{display:flex;align-items:center;gap:var(--space-3);min-height:var(--control-lg);margin-bottom:var(--space-3);padding:var(--space-1) var(--space-2);border:0;border-radius:var(--r-md);background:transparent;color:var(--text);font:var(--type-label);font-weight:700;text-align:left;width:100%}
.ui-sidebar-head:hover{background:var(--hover)}
.ui-sidebar-head>span:not(.ui-avatar){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-sidebar-head small{display:block;font:var(--type-small);color:var(--text-3)}
.ui-sidebar-head>i{color:var(--text-3)}
.ui-sidebar>.ui-nav:has(.ui-progress[data-shape=segments]){margin-top:auto;padding:var(--space-3);gap:var(--space-2)}
.ui-sidebar>.ui-nav:has(.ui-progress[data-shape=segments]) .ui-nav-label{display:flex;justify-content:space-between;padding:0;color:var(--text-2)}
.ui-sidebar>.ui-nav:has(.ui-progress[data-shape=segments]) .ui-nav-label b{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.ui-sidebar>.ui-nav:has(.ui-progress[data-shape=segments])+.ui-sidebar-foot{margin-top:var(--space-2)}
.ui-progress[data-shape=segments]>progress{border-radius:0;background:var(--line);-webkit-mask:repeating-linear-gradient(90deg,black 0 calc(100% / var(--segments, 12) - var(--edge)),transparent 0 calc(100% / var(--segments, 12)));mask:repeating-linear-gradient(90deg,black 0 calc(100% / var(--segments, 12) - var(--edge)),transparent 0 calc(100% / var(--segments, 12)))}
.ui-progress[data-shape=segments]>progress::-webkit-progress-bar{background:var(--line);border-radius:0}
.ui-progress[data-shape=segments]>progress::-webkit-progress-value{border-radius:0}
.ui-sidebar-foot{display:flex;align-items:center;gap:var(--space-3);margin-top:auto;padding:var(--space-3) var(--space-2) var(--space-1);border-top:var(--hairline) solid var(--line);font:var(--type-label)}
.ui-sidebar-foot>span:not(.ui-avatar){flex:1;min-width:0;font-weight:600}
.ui-sidebar-foot small{display:block;font:var(--type-small);color:var(--text-3)}
.ui-nav{display:grid;gap:calc(var(--space-1) / 2)}
.ui-nav+.ui-nav{margin-top:var(--space-4)}
.ui-nav-label{padding:var(--space-1) var(--space-3);font:var(--type-small);font-weight:500;color:var(--text-3)}
.ui-nav-item{display:flex;align-items:center;gap:var(--space-3);min-height:var(--control-h);padding:0 var(--space-3);border-radius:var(--r-sm);color:var(--text-2);font:var(--type-label);text-decoration:none;transition:background-color var(--t-fast),color var(--t-fast)}
.ui-nav-item>i{color:var(--text-3)}
.ui-nav-item>.ui-mark{margin-inline:calc((var(--icon) - var(--mark)) / 2)}
.ui-nav-item>span:not(.ui-mark):not(.ui-nav-count){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-nav-item:hover{background:var(--hover);color:var(--text)}
.ui-nav-item[aria-current=page]{background:var(--surface);color:var(--text);font-weight:600;box-shadow:var(--shadow-thumb)}
.ui-nav-item[aria-current=page]>i{color:var(--accent)}
[data-theme=dark] .ui-nav-item[aria-current=page]{background:var(--surface-2)}
[data-theme=dark] .ui-nav-item[aria-current=page]>i{color:var(--accent-ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ui-nav-item[aria-current=page]{background:var(--surface-2)}:root:not([data-theme=light]) .ui-nav-item[aria-current=page]>i{color:var(--accent-ink)}}
.ui-nav-count{margin-left:auto;min-width:var(--space-6);padding:0 var(--space-2);border-radius:var(--r-pill);font:var(--type-small);font-weight:500;color:var(--text-3);text-align:right;font-variant-numeric:tabular-nums}
.ui-nav-item[aria-current=page] .ui-nav-count{color:var(--text-2)}

.ui-topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:var(--space-3);min-height:var(--topbar-h);padding:0 var(--gutter);border-bottom:var(--hairline) solid var(--line);background:var(--bg)}
.ui-topbar>nav{flex:1;min-width:0;overflow:hidden}
.ui-topbar [data-nav-toggle]{display:none}
.ui-topbar .ui-button:has(>.ui-kbd){justify-content:flex-start;min-width:calc(var(--menu-min) + var(--space-6));color:var(--text-3);font-weight:500}
.ui-topbar .ui-button:has(>.ui-kbd) .ui-kbd{margin-left:auto}
.ui-topbar .ui-button:has(>.ui-kbd){margin-right:auto}

.ui-shell>main>:not(.ui-topbar){width:100%;max-width:calc(var(--content-max) + var(--gutter) * 2);margin:0 auto;padding:var(--space-7) var(--gutter) var(--space-8)}
.ui-page-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-6)}
.ui-page-title{font:var(--type-title);letter-spacing:var(--track-tight)}
.ui-page-sub{margin-top:var(--space-1);font:var(--type-body);color:var(--text-2)}
.ui-page-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}

.ui-section{min-width:0;padding:var(--space-5);border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-card)}
.ui-section-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-2) var(--space-4);margin-bottom:var(--space-4)}
.ui-section-head h2{font:var(--type-heading)}
.ui-section-head p{font:var(--type-small);color:var(--text-3)}
.ui-section-head a{display:inline-flex;align-items:center;gap:var(--space-1);min-height:var(--control-sm);font:var(--type-label);color:var(--text-2);text-decoration:none;transition:color var(--t-fast)}
.ui-section-head a::after{content:"\203A";font:var(--type-heading);color:var(--text-3)}
.ui-section-head a:hover,.ui-section-head a:hover::after{color:var(--accent-ink)}
.ui-section>.ui-table-wrap{max-width:none;margin:0 calc(var(--space-5) * -1) calc(var(--space-5) * -1);border:0;border-top:var(--hairline) solid var(--line);border-radius:0 0 var(--r-lg) var(--r-lg)}
.ui-section>.ui-table-wrap .ui-table th:first-child,.ui-section>.ui-table-wrap .ui-table td:first-child{padding-left:var(--space-5)}
.ui-section>.ui-table-wrap .ui-table th:last-child,.ui-section>.ui-table-wrap .ui-table td:last-child{padding-right:var(--space-5)}

.ui-list{display:grid;margin:0;padding:0;list-style:none}
.ui-list>*{min-width:0}
.ui-list-item{display:flex;align-items:center;gap:var(--space-3);min-height:var(--row-h);padding:var(--space-2) 0;border:0;border-bottom:var(--hairline) solid var(--line);background:transparent;color:var(--text);font:var(--type-label);font-weight:600;text-align:left;text-decoration:none;width:100%}
.ui-list>li:last-child>.ui-list-item,.ui-list>.ui-list-item:last-child{border-bottom:0}
.ui-list-item>div{flex:1;min-width:0}
.ui-list-item>div>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-list-item>div>.ui-list-meta{display:flex;flex-wrap:nowrap}
.ui-list-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-2);margin-top:calc(var(--space-1) / 2);font:var(--type-small);color:var(--text-3)}
.ui-list-item>.ui-list-meta{margin:0 0 0 auto;flex:none;white-space:nowrap}
.ui-list-item time{font-variant-numeric:tabular-nums}
.ui-list-item>i{color:var(--text-3)}
a.ui-list-item,button.ui-list-item{padding-inline:var(--space-3);border-radius:var(--r-md);border-bottom-color:transparent;transition:background-color var(--t-fast)}
a.ui-list-item:hover,button.ui-list-item:hover{background:var(--hover)}
a.ui-list-item[aria-current=true],button.ui-list-item[aria-current=true],button.ui-list-item[aria-selected=true]{background:var(--accent-subtle)}
a.ui-list-item[aria-current=true] .ui-list-meta,button.ui-list-item[aria-current=true] .ui-list-meta{color:var(--text-2)}

.ui-filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4)}
.ui-filter-bar .ui-control{flex:1 1 calc(var(--menu-min) + var(--space-6));max-width:calc(var(--menu-min) * 1.6)}
.ui-filter-bar>output,.ui-filter-bar>small{margin-left:auto;font:var(--type-small);color:var(--text-3);font-variant-numeric:tabular-nums}

/* Charts */
.ui-chart{position:relative;display:grid;grid-template-columns:var(--axis-w) minmax(0,1fr);grid-template-rows:var(--chart-h) auto;margin:0}
.ui-chart>svg{grid-column:2;grid-row:1;width:100%;height:0;min-height:100%;overflow:visible}
.ui-chart line,.ui-chart [data-role=grid]{stroke:var(--chart-grid);stroke-width:var(--hairline)}
.ui-chart [data-role=baseline]{stroke:var(--line-strong)}
.ui-chart [data-series="1"]{fill:var(--chart-1)}
.ui-chart [data-series="2"]{fill:var(--chart-2)}
.ui-chart [data-series="3"]{fill:var(--chart-3)}
.ui-chart [data-series="4"]{fill:var(--chart-4)}
.ui-chart [data-series="5"]{fill:var(--chart-5)}
.ui-chart [data-series=muted]{fill:var(--chart-muted)}
.ui-chart [data-series=empty]{fill:var(--chart-grid)}
.ui-chart [data-series=past]{fill:var(--chart-muted)}
.ui-chart rect{transition:opacity var(--t-fast)}
.ui-chart svg:hover rect:not(:hover){opacity:.55}
.ui-chart-axis{font:var(--type-small);color:var(--chart-axis);font-variant-numeric:tabular-nums}
.ui-chart-axis[data-axis=y]{position:relative;grid-column:1;grid-row:1}
.ui-chart-axis[data-axis=y]>span{position:absolute;right:var(--space-2);top:calc(var(--p) * 1%);transform:translateY(-50%)}
.ui-chart-axis[data-axis=x]{grid-column:2;grid-row:2;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding-top:var(--space-2);text-align:center;white-space:nowrap}
.ui-chart-legend{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4);margin:0;padding:0;list-style:none;font:var(--type-small);color:var(--text-2)}
.ui-chart-legend>li,.ui-chart-legend>span{display:inline-flex;align-items:center;gap:var(--space-2)}

/* List detail */
.ui-detail{min-width:0;padding:var(--space-6);border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-card)}
.ui-detail-head{display:grid;gap:var(--space-3);padding-bottom:var(--space-5)}
.ui-detail-head>.ui-badge,.ui-detail-head>.ui-status{justify-self:start}
.ui-detail-head h2{font:var(--type-subtitle);letter-spacing:var(--track-snug)}
.ui-detail-head p{font:var(--type-body);color:var(--text-2)}
.ui-detail-row{display:grid;grid-template-columns:var(--detail-label-w) minmax(0,1fr);align-items:center;gap:var(--space-4);min-height:var(--row-h);padding:var(--space-2) 0;border-top:var(--hairline) solid var(--line);font:var(--type-body);color:var(--text)}
.ui-detail-row>:first-child{display:flex;align-items:center;gap:var(--space-2);font:var(--type-label);color:var(--text-3)}
.ui-detail-row>:last-child{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);min-width:0}
.ui-detail-row a{color:var(--accent-ink);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Settings */
.ui-settings-group{padding:0;border:var(--hairline) solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-card);scroll-margin-top:calc(var(--topbar-h) + var(--space-4))}
.ui-settings-group>header{padding:var(--space-5) var(--space-5) var(--space-4)}
.ui-settings-group>header h2{font:var(--type-heading)}
.ui-settings-group>header p{margin-top:calc(var(--space-1) / 2);font:var(--type-small);color:var(--text-3)}
.ui-settings-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,var(--settings-control-w));align-items:center;gap:var(--space-3) var(--space-6);padding:var(--space-4) var(--space-5);border-top:var(--hairline) solid var(--line)}
.ui-settings-row>div:first-child{min-width:0}
.ui-settings-row>div:first-child>:first-child{display:block;font:var(--type-label);font-weight:600;color:var(--text)}
.ui-settings-row>div:first-child>p,.ui-settings-row>div:first-child>small{display:block;margin-top:calc(var(--space-1) / 2);font:var(--type-small);color:var(--text-3)}
.ui-settings-row>:last-child:not(:first-child){display:flex;justify-content:flex-end;align-items:center;gap:var(--space-2);min-width:0}
.ui-settings-row .ui-switch{min-height:var(--control-h)}

.ui-danger{border:var(--hairline) solid color-mix(in oklab,var(--bad) 30%,var(--line));border-radius:var(--r-lg);background:var(--surface)}
.ui-danger>header{padding:var(--space-5) var(--space-5) var(--space-4)}
.ui-danger>header h2{font:var(--type-heading);color:var(--bad)}
.ui-danger>header p{margin-top:calc(var(--space-1) / 2);font:var(--type-small);color:var(--text-3)}
.ui-danger .ui-settings-row{border-top-color:color-mix(in oklab,var(--bad) 18%,var(--line))}

/* Phone */
@media (max-width:48em){
  .ui-shell{grid-template-columns:minmax(0,1fr)}
  .ui-sidebar{position:fixed;inset:0 auto 0 0;z-index:40;width:min(calc(var(--sidebar-w) + var(--space-6)),86vw);background:var(--surface);border-right:0;box-shadow:var(--shadow-float);transform:translateX(-105%);visibility:hidden;transition:transform var(--t-layer) var(--ease-out),visibility 0s linear var(--t-layer)}
  .ui-shell[data-nav-open] .ui-sidebar{transform:none;visibility:visible;transition:transform var(--t-layer) var(--ease-out)}
  .ui-shell[data-nav-open]::after{content:"";position:fixed;inset:0;z-index:30;background:var(--scrim)}
  .ui-nav-item,.ui-sidebar-head{min-height:var(--touch)}
  .ui-topbar{gap:var(--space-2)}
  .ui-topbar [data-nav-toggle]{display:inline-flex;margin-left:calc(var(--space-2) * -1)}
  .ui-topbar .ui-button:has(>.ui-kbd){min-width:0;width:var(--touch);padding:0;justify-content:center;border-color:transparent;background:transparent;box-shadow:none;color:var(--text-2)}
  .ui-topbar .ui-button:has(>.ui-kbd)>span{display:none}
  .ui-shell>main>:not(.ui-topbar){padding-top:var(--space-6)}
  .ui-page-header{align-items:flex-start;flex-direction:column}
  .ui-page-actions{width:100%}
  .ui-page-actions>.ui-segmented{flex:1}
  .ui-stat-strip{grid-template-columns:minmax(0,1fr)}
  .ui-stat{padding:var(--space-4) var(--space-5)}
  .ui-stat+.ui-stat{border-left:0;border-top:var(--hairline) solid var(--line)}
  .ui-section,.ui-detail{padding:var(--space-4)}
  .ui-section>.ui-table-wrap{max-width:none;margin:0 calc(var(--space-4) * -1) calc(var(--space-4) * -1)}
  .ui-section>.ui-table-wrap .ui-table th:first-child,.ui-section>.ui-table-wrap .ui-table td:first-child{padding-left:var(--space-4)}
  .ui-chart-axis[data-axis=x]>span:nth-child(even){visibility:hidden}
  .ui-filter-bar .ui-control{flex-basis:100%;max-width:none}
  .ui-settings-group>header,.ui-danger>header{padding:var(--space-4) var(--space-4) var(--space-3)}
  .ui-settings-row{grid-template-columns:minmax(0,1fr);padding:var(--space-4)}
  .ui-settings-row>:last-child:not(:first-child){justify-content:flex-start}
  .ui-settings-row:has(.ui-switch){grid-template-columns:minmax(0,1fr) auto}
  .ui-detail-row{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
  .ui-section-head a,.ui-detail-row a,.ui-data-list a,.ui-alert>a{display:inline-flex;align-items:center;min-height:var(--touch)}
  .ui-switch{min-height:var(--touch);min-width:var(--touch);justify-content:flex-end}
  .ui-button,.ui-input,.ui-select,.ui-tabs [role=tab]{min-height:var(--touch)}
  .ui-input,.ui-select,.ui-textarea{font-size:var(--input-phone)}
  .ui-chip,.ui-pagination button,.ui-list-item,.ui-segmented button{min-height:var(--touch)}
  .ui-button[data-icon]{width:var(--touch)}
  .ui-tabs{gap:var(--space-4)}
  .ui-breadcrumb a{display:inline-flex;align-items:center;min-height:var(--touch)}
  .ui-settings-row .ui-switch{min-height:var(--touch)}
  .ui-choice{min-height:var(--touch)}
  .ui-data-list{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
  .ui-data-list>dd{padding-left:var(--space-3)}
  .ui-steps{gap:var(--space-2)}
  .ui-step:not([aria-current=step])>span{position:absolute;width:var(--hairline);height:var(--hairline);overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .ui-step:not(:last-child)::after{min-width:var(--space-3)}
  :is(.ui-slider input[type=range],input[type=range].ui-slider){height:var(--touch)}
  :is(.ui-combobox input,input.ui-combobox){min-height:var(--touch);font-size:var(--input-phone)}
  .ui-auth{align-content:start;padding-top:var(--space-6)}
  .ui-auth>section,.ui-auth>form{padding:var(--space-5)}
  .ui-alert{flex-wrap:wrap}
  .ui-alert>:is(p,div){flex-basis:calc(100% - var(--icon-lg) - var(--space-3))}
  .ui-alert>:is(.ui-button,a){margin-left:calc(var(--icon-lg) + var(--space-3))}
}