/* Page de liaison d'appareil (vague P1) — autonome, même langage
   visuel que la console (variables --p-*), thème par
   prefers-color-scheme (la page vit hors de la console). */
:root {
  --p-fond: #fbfbfa; --p-surface: #ffffff; --p-bord: #e4e5e0;
  --p-texte: #242624; --p-doux: #6c7268;
  --p-chip-bord: #d6d8d1; --p-champ: #ffffff;
  --p-danger-fond: #f6e3de; --p-danger: #a03a28;
  --p-lien: #5b3df0; --p-ok: #2ea36b;
}
@media (prefers-color-scheme: dark) {
  :root {
    --p-fond: #17181a; --p-surface: #1f2023; --p-bord: #33353a;
    --p-texte: #eceeeb; --p-doux: #a6aba0;
    --p-chip-bord: #3a3c41; --p-champ: #1f2023;
    --p-danger-fond: #40241f; --p-danger: #e8a08d;
    --p-lien: #b39df5;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--p-fond); color: var(--p-texte);
  font: 15px/1.55 system-ui, "Segoe UI", sans-serif;
}
.liaison {
  max-width: 560px; margin: 0 auto; padding: 48px 20px 32px;
}
.marque { font-size: 30px; }
h1 { font-size: 24px; margin: 8px 0 6px; }
h2 { font-size: 17px; margin: 28px 0 8px; }
.doux { color: var(--p-doux); font-size: 13.5px; }
.pied { margin-top: 36px; }
.btn {
  display: inline-block; font: inherit; cursor: pointer;
  background: var(--p-lien); color: #fff; border: 0;
  border-radius: 9px; padding: 8px 16px; text-decoration: none;
}
.btn-refus {
  background: transparent; color: var(--p-danger);
  border: 1px solid var(--p-danger);
}
.demande {
  background: var(--p-surface); border: 1px solid var(--p-bord);
  border-radius: 12px; padding: 14px 16px; margin: 10px 0;
}
.demande .nom { font-weight: 600; }
.demande .code {
  font-family: ui-monospace, "Cascadia Mono", monospace;
  font-size: 19px; letter-spacing: 2px; margin: 4px 0;
}
.demande .actions { display: flex; gap: 8px; margin-top: 10px; }
form#form-code { display: flex; gap: 8px; }
form#form-code input {
  font: inherit; flex: 1; background: var(--p-champ);
  color: var(--p-texte); border: 1px solid var(--p-chip-bord);
  border-radius: 9px; padding: 8px 10px;
  font-family: ui-monospace, "Cascadia Mono", monospace;
  letter-spacing: 2px; text-transform: uppercase;
}
.retour { min-height: 1.4em; font-weight: 600; }
.retour.ok { color: var(--p-ok); }
.retour.erreur { color: var(--p-danger); }