.muted { color: var(--pico-muted-color); }
.error { color: var(--pico-del-color); }
.success { color: var(--pico-ins-color); }
form.inline { margin: 0; }
button.small { padding: .3rem .7rem; font-size: .85rem; margin: 0; }
.login { max-width: 420px; margin: 3rem auto; }
.game-card header { display: flex; justify-content: space-between; align-items: center; }
.actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.actions > * { width: auto; margin: 0; }
.sticky { position: sticky; bottom: 0; background: var(--pico-background-color); padding: .75rem 0; }
.badge { font-size: .8rem; padding: .15rem .6rem; border-radius: 1rem; background: var(--pico-muted-border-color); }
.state-active { background: #2e7d32; color: #fff; }
.state-activating, .state-deactivating { background: #f9a825; color: #000; }
.state-failed { background: #c62828; color: #fff; }
.logs { max-height: 24rem; overflow: auto; font-size: .75rem; white-space: pre-wrap; }
table.cars td.slots { width: 7rem; }
table.cars input { margin: 0; }
textarea.code { font-family: var(--pico-font-family-monospace); font-size: .85rem; }
.content-filter { display: flex; gap: 1.5rem; flex-wrap: wrap; align-items: center; }
.content-filter legend { width: 100%; }
table.mods td.mod-actions { width: 1%; white-space: nowrap; text-align: right; }
table.mods td.mod-actions [role=button] { padding: .35rem .8rem; margin: .15rem 0; }
table.mods .badge { display: inline-block; margin: .2rem .2rem 0 0; }
.mod-note { display: inline-block; margin: .2rem 0; padding: .2rem .6rem; border-left: 3px solid var(--pico-primary); white-space: pre-line; }
/* navigation */
nav.main-nav details.dropdown summary { margin: 0; }
nav.main-nav details.dropdown ul li a { text-align: left; }
/* F1 : joueurs en direct */
.live-box { margin: -.5rem 0 1rem; }
.live-summary { margin: 0; }
.live-players { margin: .25rem 0 0; padding-left: 1.2rem; font-size: .9rem; }
.live-players li { margin: 0; }
/* F2 journal */
.journal-filters .actions { margin-top: .5rem; }
.journal-table td.journal-date { white-space: nowrap; }
.journal-table td { word-break: break-word; }
.journal-pagination { display: flex; justify-content: space-between; }
/* F5 : santé du service */
.health-errors { margin-bottom: 1rem; padding: .6rem .8rem; border-left: 4px solid #c62828; background: color-mix(in srgb, #c62828 10%, transparent); }
.health-errors pre.logs { margin: .4rem 0 0; max-height: 10rem; }
.health-lint { margin-bottom: 1rem; padding: .6rem .8rem; border-left: 4px solid #f9a825; background: color-mix(in srgb, #f9a825 12%, transparent); }
.health-lint ul { margin: .4rem 0 0; padding-left: 1.2rem; }
.health-lint li { margin-bottom: .2rem; }
/* presets (F8) */
.presets-save { display: flex; gap: .5rem; align-items: flex-start; flex-wrap: wrap; margin: 0; }
.presets-save input { flex: 1 1 14rem; margin: 0; }
.presets-save button { width: auto; margin: 0; }
.presets-item header { margin-bottom: .75rem; }
.presets-actions { margin-bottom: .5rem; align-items: center; }
.presets-force { display: inline-flex; align-items: center; gap: .3rem; font-size: .85rem; margin: 0; }
.presets-rename summary { width: auto; margin: 0; padding: .3rem .7rem; font-size: .85rem; }
.presets-rename[open] { flex-basis: 100%; }
table.presets-backups td.presets-cell-actions { text-align: right; }
table.presets-backups td.presets-cell-actions .presets-actions, table.presets-backups td.presets-cell-actions .presets-save { justify-content: flex-end; }
/* F10 : miniatures des voitures et des pistes */
table.cars td.content-thumb { width: 64px; padding-right: 0; }
table.cars td.content-thumb img { display: block; width: 64px; height: 36px; object-fit: contain; border-radius: 4px; }
.content-track { display: flex; gap: .75rem; align-items: flex-start; flex-wrap: wrap; margin-bottom: 1rem; }
.content-track img { max-height: 110px; max-width: 100%; height: auto; object-fit: contain; border-radius: 4px; }
.content-track img[data-key=outline] { width: 110px; }
/* F13 : espace disque et ménage des mods */
.mods-cleanup-disk { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; margin-bottom: 1rem; }
.mods-cleanup-gauge { flex: 1 1 16rem; }
.mods-cleanup-gauge progress { margin-bottom: .2rem; }
.mods-cleanup-disk form, .mods-cleanup-actions form { margin: 0; }
.mods-cleanup-disk button, .mods-cleanup-actions button { width: auto; margin: 0; }
/* F7 : éditeur de slots et trafic IA */
.slots-car header { display: flex; gap: .5rem .75rem; align-items: center; flex-wrap: wrap; margin-bottom: .5rem; }
.slots-car header .slots-apply-all { width: auto; margin: 0 0 0 auto; padding: .3rem .7rem; font-size: .85rem; }
table.slots-table { margin-bottom: 0; }
table.slots-table input, table.slots-table select { margin: 0; min-width: 5rem; }
table.slots-table td.slots-index { width: 1%; color: var(--pico-muted-color); }
table.slots-table td.slots-skin { display: flex; gap: .5rem; align-items: center; min-width: 14rem; }
table.slots-table img.slots-thumb { width: 64px; height: 36px; object-fit: contain; border-radius: 4px; flex: none; }
.slots-traffic[disabled] { opacity: .6; }
/* F6 : paramètres serveur et sessions */
.server-form article header { margin-bottom: 1rem; }
.server-form h4 { margin: .5rem 0 .75rem; font-size: 1rem; }
.server-form label > small.muted { display: block; margin-top: .2rem; font-size: .8rem; }
.server-format { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.server-format label { margin: 0; }
.server-session { margin: 0 0 .5rem; padding: .6rem .8rem; border: 1px solid var(--pico-muted-border-color); border-radius: var(--pico-border-radius); }
.server-session legend { padding: 0 .3rem; font-weight: 600; }
.server-session legend label { margin: 0; }
.server-pqr[hidden] { display: none; }
/* F3 : réglages et notifications Discord */
.notify-url { font-family: monospace; word-break: break-all; }
.notify-categories { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .25rem 1rem; margin-bottom: 1rem; }
.notify-categories label { margin: 0; }
.notify-actions { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
.notify-actions form { margin: 0; }
.notify-actions button { width: auto; margin: 0; }
.notify-clear { display: inline-flex; align-items: center; gap: .3rem; font-size: .85rem; margin: 0; }
