/* HUXOS components. Every colour, size and radius comes from tokens.css. */
.hx-btn{font:600 15px/20px var(--font-sans);border-radius:var(--radius-sm);padding:var(--space-3) 22px;border:var(--border-width) solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-2);transition:background-color var(--duration-fast),color var(--duration-fast),border-color var(--duration-fast)}
.hx-btn-sm{font-size:14px;padding:var(--space-2) var(--space-4)}
.hx-btn:focus-visible,.hx-input:focus-visible,.hx-tab:focus-visible,.hx-header-link:focus-visible,.hx-header-logo:focus-visible{outline:var(--focus-width) solid var(--focus);outline-offset:var(--focus-width)}
.hx-btn-primary{background:var(--action);color:var(--on-action)}
.hx-btn-primary:hover{background:var(--action-hover)}
.hx-btn-secondary{background:var(--surface);color:var(--brand);border-color:var(--brand)}
.hx-btn-secondary:hover{background:var(--surface-alt)}
.hx-btn-ghost{background:none;color:var(--action);padding-left:0;padding-right:0}
.hx-btn-ghost:hover{color:var(--action-hover);text-decoration:underline;text-underline-offset:3px}
.hx-btn-danger{background:var(--danger);color:#FFFFFF}
.hx-btn:disabled{opacity:.45;cursor:not-allowed}
.hx-btn.hx-on-band.hx-btn-primary{background:var(--on-band);color:var(--band)}
.hx-btn.hx-on-band.hx-btn-secondary{background:none;color:var(--on-band);border-color:var(--on-band-muted)}
.hx-btn.hx-on-band.hx-btn-secondary:hover{background:var(--on-band);color:var(--band)}
.hx-btn.hx-on-band:focus-visible{outline-color:var(--on-band)}
.hx-field{display:flex;flex-direction:column;gap:var(--space-2);max-width:360px;font-family:var(--font-sans)}
.hx-field-label{font:600 14px/20px var(--font-sans);color:var(--ink)}
.hx-input{font:400 15px/22px var(--font-sans);color:var(--ink);background:var(--surface);border:var(--border-width) solid var(--line-strong);border-radius:var(--radius-sm);padding:11px var(--space-3)}
.hx-input::placeholder{color:var(--ink-muted)}
.hx-field-error .hx-input{border-color:var(--danger)}
.hx-field-hint{font-size:13px;line-height:20px;color:var(--ink-muted)}
.hx-field-err{font-size:13px;line-height:20px;color:var(--danger)}
.hx-badge{display:inline-flex;align-items:center;font:600 12px/16px var(--font-sans);padding:var(--space-1) 10px;border-radius:var(--radius-pill);border:var(--border-width) solid var(--line);color:var(--ink);background:var(--surface-alt)}
.hx-badge-info{background:var(--info-soft);border-color:transparent;color:var(--brand)}
.hx-badge-success{background:var(--success-soft);border-color:transparent;color:var(--success)}
.hx-badge-warning{background:var(--warning-soft);border-color:transparent;color:var(--warning)}
.hx-badge-danger{background:var(--danger-soft);border-color:transparent;color:var(--danger)}
.hx-overline{font:500 12px/16px var(--font-display);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted)}
.hx-card{background:var(--surface);border:var(--border-width) solid var(--line);border-radius:var(--radius-md);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-2);font-family:var(--font-sans);color:var(--ink);max-width:420px}
.hx-card-title{margin:0;font:800 18px/24px var(--font-display);color:var(--brand)}
.hx-card-body{font-size:15px;line-height:24px;color:var(--ink-muted)}
.hx-card-footer{margin-top:var(--space-3);padding-top:var(--space-4);border-top:var(--border-width) solid var(--line);font-size:14px}
.hx-card-band{background:var(--band);border-color:var(--band)}
.hx-card-band .hx-card-title{color:var(--on-band)}
.hx-card-band .hx-card-body,.hx-card-band .hx-overline{color:var(--on-band-muted)}
.hx-alert{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-4);border-radius:var(--radius-md);font-family:var(--font-sans);color:var(--ink);max-width:560px}
.hx-alert-icon{flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.hx-alert-title{font:600 15px/22px var(--font-sans)}
.hx-alert-text{font-size:14px;line-height:22px}
.hx-alert-info{background:var(--info-soft)} .hx-alert-info .hx-alert-icon{color:var(--brand)}
.hx-alert-success{background:var(--success-soft)} .hx-alert-success .hx-alert-icon{color:var(--success)}
.hx-alert-warning{background:var(--warning-soft)} .hx-alert-warning .hx-alert-icon{color:var(--warning)}
.hx-alert-danger{background:var(--danger-soft)} .hx-alert-danger .hx-alert-icon{color:var(--danger)}
.hx-tabs{font-family:var(--font-sans);color:var(--ink)}
.hx-tablist{display:flex;gap:var(--space-6);border-bottom:var(--border-width) solid var(--line);overflow-x:auto}
.hx-tab{font:600 14px/20px var(--font-sans);color:var(--ink-muted);background:none;border:0;border-bottom:2px solid transparent;padding:var(--space-3) 0;cursor:pointer;white-space:nowrap;margin-bottom:-1px}
.hx-tab:hover{color:var(--ink)}
.hx-tab-on{color:var(--brand);border-bottom-color:var(--action)}
.hx-tabpanel{padding:var(--space-4) 0;font-size:15px;line-height:24px;color:var(--ink-muted)}
.hx-table-wrap{overflow-x:auto;border:var(--border-width) solid var(--line);border-radius:var(--radius-md)}
.hx-table{border-collapse:collapse;width:100%;font:400 14px/20px var(--font-sans);color:var(--ink)}
.hx-table caption{text-align:left;padding:var(--space-3) var(--space-4);font-size:13px;color:var(--ink-muted);caption-side:bottom;border-top:var(--border-width) solid var(--line)}
.hx-table th{font-weight:600;text-align:left;background:var(--surface-alt);padding:var(--space-3) var(--space-4);border-bottom:var(--border-width) solid var(--line)}
.hx-table td{padding:var(--space-3) var(--space-4);border-bottom:var(--border-width) solid var(--line)}
.hx-table tbody tr:last-child td{border-bottom:0}
.hx-num{text-align:right!important;font-variant-numeric:tabular-nums}
.hx-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);height:var(--header-height);padding:0 var(--space-6);background:var(--surface);border-bottom:var(--border-width) solid var(--line);font-family:var(--font-sans)}
.hx-header-band{background:var(--band);border-bottom-color:var(--band)}
.hx-header-logo{display:flex;align-items:center}
.hx-header-logo img{height:36px;width:auto;display:block}
.hx-header-logo .hx-logo-dark{display:none}
[data-theme="dark"] .hx-header-logo .hx-logo-light{display:none}
[data-theme="dark"] .hx-header-logo .hx-logo-dark{display:block}
.hx-header-nav{display:flex;align-items:center;gap:var(--space-6)}
.hx-header-link{font:400 15px/20px var(--font-sans);color:var(--ink);text-decoration:none}
.hx-header-link:hover,.hx-header-link-on{color:var(--action)}
.hx-header-band .hx-header-link{color:var(--on-band-muted)}
.hx-header-band .hx-header-link:hover,.hx-header-band .hx-header-link-on{color:var(--on-band)}
@media (max-width:720px){.hx-header-link{display:none}}
@media (prefers-reduced-motion:reduce){.hx-btn{transition:none}}
.hx-engine{display:inline-flex;align-items:center;gap:var(--space-2);font:400 15px/20px var(--font-display);color:var(--ink)}
.hx-engine-bar{width:3px;height:18px;border-radius:2px}
.hx-engine-hux{font-weight:800;letter-spacing:.06em;color:var(--brand)}