/* Salon IRC — style « Fréquence » : un poste radio à phosphore ambre qui capte #cyberservices.
   Une seule lumière : le phosphore. Pas de motif, juste un léger balayage de lignes et une lueur.
   Le cadre-signature (calque/) n'est pas touché ; tout se passe dans .poste. */
.poste{
  --fond:#0b0703; --fond2:#120c05; --ambre:#ffb347; --ambre-vif:#ffd08a; --ambre-doux:#c98a3a; --brun:#5a3d17;
  --trait:#3a2810; --rouge:#ff6a4d; --vert:#3cf0b4;
  position:relative;display:flex;flex-direction:column;overflow:hidden!important;
  background:radial-gradient(120% 90% at 50% 30%,var(--fond2),var(--fond) 70%);
  color:var(--ambre);font:400 14px/1.5 "USM",ui-monospace,Consolas,monospace;text-shadow:0 0 6px #ffb34733;
}
.poste::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:5;
  background:repeating-linear-gradient(0deg,#0000 0 2px,#00000022 2px 3px);mix-blend-mode:multiply}
.poste > *{position:relative;z-index:1}
.mut{color:var(--ambre-doux)}

/* ── Le cadran ── */
.cadran{flex:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;
  border-bottom:1px solid var(--trait);background:linear-gradient(180deg,#1a1107,#0d0904)}
.frequence{display:flex;align-items:center;gap:12px;min-width:0}
.f-nom{font-weight:600;font-size:16px;letter-spacing:.04em;color:var(--ambre-vif);text-shadow:0 0 10px #ffb34766;cursor:default;user-select:none}
.f-onde{display:inline-flex;align-items:flex-end;gap:2px;height:16px}
.f-onde i{display:block;width:3px;height:30%;background:var(--ambre);opacity:.7;border-radius:1px}
.poste[data-etat="connecte"] .f-onde i{animation:onde 1.6s ease-in-out infinite}
.f-onde i:nth-child(2){animation-delay:-.2s}.f-onde i:nth-child(3){animation-delay:-.5s}.f-onde i:nth-child(4){animation-delay:-.9s}
.f-onde i:nth-child(5){animation-delay:-.3s}.f-onde i:nth-child(6){animation-delay:-.7s}.f-onde i:nth-child(7){animation-delay:-1.1s}
@keyframes onde{0%,100%{height:20%}50%{height:100%}}
.voyants{display:flex;align-items:center;gap:10px;font-size:12px}
.voyant{display:inline-flex;align-items:center;gap:6px;color:var(--ambre-doux)}
.voyant i{width:8px;height:8px;border-radius:50%;background:#3a2a14;box-shadow:inset 0 0 2px #000}
.voyant[data-etat="connecte"] i{background:var(--rouge);box-shadow:0 0 8px var(--rouge)}
.voyant[data-etat="connecte"] b{color:var(--ambre-vif)}
.voyant[data-etat="connexion"] i,.voyant[data-etat="attente"] i{background:var(--ambre);animation:clignote 1s steps(2) infinite}
@keyframes clignote{50%{opacity:.2}}
.voyant b{font-weight:500}
.b-presents{font:inherit;font-size:12px;color:var(--ambre);background:transparent;border:1px solid var(--brun);padding:2px 8px;cursor:pointer}
.b-presents:hover,.b-presents[aria-expanded="true"]{background:var(--ambre);color:var(--fond);text-shadow:none}

/* ── Les ondes : le fil et les présents ── */
.ondes{flex:1 1 0;min-height:0;display:flex}
.fil{flex:1;min-width:0;overflow-y:auto;padding:12px 16px;scrollbar-color:var(--brun) transparent}
.ligne{display:flex;gap:10px;padding:1px 0;white-space:pre-wrap;word-break:break-word}
.ligne .h{flex:none;color:var(--brun);font-size:12px;padding-top:2px}
.ligne .de{flex:none;color:var(--ambre-vif);font-weight:600}
.ligne .de::before{content:"<";color:var(--brun)}.ligne .de::after{content:">";color:var(--brun)}
.ligne.moi .de{color:var(--vert);text-shadow:0 0 6px #3cf0b444}
.ligne.op .de{color:var(--rouge)}
.ligne.action .t{font-style:italic}
.ligne.action .de::before{content:"* ";color:var(--brun)}.ligne.action .de::after{content:""}
.ligne.info,.ligne.sanction,.ligne.repere{color:var(--ambre-doux);font-size:12.5px}
.ligne.info .t::before{content:"— "}
.ligne.sanction{color:#9a8a76}
.ligne.sanction .t::before{content:"⚑ "}
.ligne.avis{color:var(--ambre-doux)}
.ligne.avis .de::before{content:"-";}.ligne.avis .de::after{content:"-"}
.ligne.repere{justify-content:center;color:var(--brun);letter-spacing:.2em;font-size:11px;padding:6px 0}
.ligne.historique{opacity:.72}
.ligne.retire .t{color:#7a6650;font-style:italic}
.ligne a{color:var(--ambre-vif)}
.presents{flex:none;width:190px;overflow-y:auto;border-left:1px solid var(--trait);padding:10px 12px;background:#0000002e}
.presents h2{margin:0 0 8px;font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--ambre-doux)}
.presents ul{list-style:none;margin:0;padding:0;font-size:13px}
.presents li{padding:1px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presents li.op{color:var(--rouge)}.presents li.op::before{content:"@";color:var(--brun)}
.presents li.moi{color:var(--vert)}

/* ── L'émetteur ── */
.emetteur{flex:none;border-top:1px solid var(--trait);padding:10px 16px 12px;background:linear-gradient(0deg,#140d05,#0d0904)}
.entree{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.entree label{color:var(--ambre-doux);font-size:12px}
.entree input,.saisie input{font:inherit;color:var(--ambre-vif);background:#00000055;border:1px solid var(--brun);padding:6px 10px;outline:none;caret-color:var(--ambre-vif)}
.entree input{width:200px}
.entree input:focus,.saisie input:focus{border-color:var(--ambre);box-shadow:0 0 0 1px #ffb34755,0 0 12px #ffb34722}
.b-entrer,.b-envoyer{font:inherit;color:var(--fond);background:var(--ambre);border:1px solid var(--ambre);padding:6px 12px;cursor:pointer;text-shadow:none}
.b-entrer:hover,.b-envoyer:hover{background:var(--ambre-vif)}
.charte{flex-basis:100%;margin:2px 0 0;font-size:12px;color:var(--ambre-doux)}
.charte b{color:var(--ambre)}
.charte a{color:var(--ambre)}
.saisie{display:flex;align-items:center;gap:8px}
.saisie[hidden],.entree[hidden]{display:none}
.invite{flex:none;color:var(--vert);text-shadow:0 0 6px #3cf0b444;font-size:13px}
.saisie input{flex:1;min-width:0}
.erreur{margin:6px 0 0;min-height:1em;font-size:12px;color:var(--rouge)}
.erreur:empty{margin:0;min-height:0}

/* ── Secrets ── */
.poste.balayage .fil{animation:balayage 2.4s ease-out}
@keyframes balayage{0%{filter:brightness(2.2) hue-rotate(-20deg)}100%{filter:none}}
.poste.ecoute::before{content:"on n'écoute personne, promis ;)";position:absolute;top:48px;right:16px;z-index:6;
  padding:4px 8px;border:1px solid var(--brun);background:var(--fond);color:var(--ambre-vif);font-size:12px}
.ligne.secret{color:var(--vert);white-space:pre;font-size:11px;line-height:1.2}

/* ── Téléphone ── */
@media (max-width:640px){
  .cadran{padding:8px 10px}
  .f-nom{font-size:14px;white-space:nowrap}
  .f-onde{display:none}
  .voyant b,.b-presents{white-space:nowrap}
  .voyants{gap:6px}
  .fil{padding:10px}
  .ligne .h{display:none}
  .presents{position:absolute;right:0;top:0;bottom:0;width:min(220px,70vw);background:var(--fond);box-shadow:-8px 0 20px #000a;display:none}
  .presents.ouvert{display:block}
  .emetteur{padding:8px 10px 10px}
  .entree input{flex:1;width:auto}
  .invite{display:none}
}
@media (min-width:641px){ .b-presents{pointer-events:none;border-color:transparent;padding:2px 0} }
@media (prefers-reduced-motion:reduce){ .f-onde i,.voyant i{animation:none!important} .poste.balayage .fil{animation:none} }