/* composants */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-5);border:var(--border-width) solid var(--color-accent);border-radius:var(--radius-sm);background:var(--color-accent);color:var(--color-accent-contrast);font-size:var(--text-sm);font-weight:var(--weight-medium);text-decoration:none;cursor:pointer}
.btn:hover{background:transparent;color:var(--color-accent);text-decoration:none}
.btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn--ghost{background:transparent;color:var(--color-text);border-color:var(--color-border)}
.btn--ghost:hover{color:var(--color-accent);border-color:var(--color-accent)}
.btn--danger{background:var(--color-danger);border-color:var(--color-danger);color:var(--color-bg)}
.btn--sm{min-height:36px;padding:0 var(--space-4);font-size:var(--text-xs)}
.btn--icon{width:44px;padding:0}
.badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:2px var(--space-3);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-muted);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.badge__dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.badge--accent{color:var(--color-accent);border-color:currentColor}
.badge--success{color:var(--color-success);border-color:currentColor}
.badge--warning{color:var(--color-warning);border-color:currentColor}
.badge--danger{color:var(--color-danger);border-color:currentColor}
.tag{display:inline-block;padding:1px var(--space-2);border-radius:var(--radius-sm);background:var(--color-surface-2);color:var(--color-muted);font-family:var(--font-mono);font-size:var(--text-xs)}
.tag--accent{color:var(--color-accent)}
.card{background:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-lg)}
.card__body,.card__foot{padding:var(--space-5)}
.card__foot{border-top:var(--border-width) solid var(--color-border)}
.card__title{margin:0;font-size:var(--text-md)}
.card__subtitle{margin:var(--space-1) 0 0;color:var(--color-muted);font-size:var(--text-sm)}
.alert{padding:var(--space-4);border:var(--border-width) solid var(--color-border);border-left-width:3px;border-radius:var(--radius-sm);font-size:var(--text-sm)}
.alert--info{border-left-color:var(--color-accent)}
.alert--success{border-left-color:var(--color-success)}
.alert--warning{border-left-color:var(--color-warning)}
.alert--danger{border-left-color:var(--color-danger)}
.alert__title{margin:0 0 var(--space-1);font-weight:var(--weight-medium)}
.field{display:flex;flex-direction:column;gap:var(--space-2)}
.label{font-size:var(--text-sm)}
.hint,.field__error{font-size:var(--text-xs);color:var(--color-muted)}
.field__error{color:var(--color-danger)}
.input,.textarea,.select{width:100%;min-height:44px;padding:var(--space-2) var(--space-3);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-2);color:var(--color-text)}
.input:focus-visible,.textarea:focus-visible,.select:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:var(--focus-ring)}
.input[aria-invalid=true]{border-color:var(--color-danger)}
.textarea{min-height:112px;resize:vertical}
.table-wrap{overflow-x:auto;border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm)}
.table{width:100%;border-collapse:collapse;font-size:var(--text-sm);text-align:left}
.table th,.table td{padding:var(--space-3) var(--space-4);border-bottom:var(--border-width) solid var(--color-border)}
.table thead th{color:var(--color-muted);font-size:var(--text-xs);font-weight:var(--weight-normal);text-transform:uppercase;letter-spacing:.06em}
.table tbody tr:last-child td{border-bottom:0}
.nav{display:flex;flex-wrap:wrap;gap:var(--space-1);padding:var(--space-1);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm)}
.nav__link{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--color-muted);font-size:var(--text-sm);text-decoration:none}
.nav__link:hover{color:var(--color-text);text-decoration:none}
.nav__link--active{background:var(--color-accent-soft);color:var(--color-accent)}
.avatar{display:inline-grid;place-items:center;width:40px;height:40px;border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-accent);font-weight:var(--weight-medium);text-transform:uppercase}