/* Console Minecaria : meme univers que le site (noir bleute, facettes, Chakra Petch), en plus dense pour le travail. */
:root{
  --fond:#0b0d12; --fond2:#131720; --fond3:#1b2030; --ligne:#272d3b; --texte:#eef1f6; --doux:#9aa3b5; --accent:#8b5cf6;
  --vert:#4ade80; --rouge:#f87171; --orange:#fb923c; --cyan:#22d3ee; --violet:#a78bfa;
  --ethrite:#7fb3a6; --saphire:#4a8cff; --epidote:#5bd46a; --onyx:#b25cff; --galena:#f5c542;
  --titre:"Chakra Petch",system-ui,sans-serif; --corps:"Inter",system-ui,sans-serif; --mono:ui-monospace,"Cascadia Mono",Consolas,monospace;
  --pan:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
  --pan-btn:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:var(--fond);color:var(--texte);font:14px/1.55 var(--corps)}
a{color:var(--accent);text-underline-offset:3px}
h1,h2,h3{font-family:var(--titre);text-transform:uppercase;letter-spacing:.06em;margin:0 0 12px;text-wrap:balance}
h1{font-size:24px}h2{font-size:15px;color:var(--doux)}h3{font-size:13px;margin-top:16px}
main{max-width:1400px;margin:0 auto;padding-block:20px 48px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:16px}
.doux{color:var(--doux)}.rouge{color:var(--rouge)}
.gemme{display:inline-block;width:12px;height:12px;background:var(--accent);transform:rotate(45deg);margin-right:10px}

.haut{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;padding-block:10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  background:color-mix(in srgb,var(--fond) 90%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--ligne)}
.logo{font:700 18px var(--titre);text-transform:uppercase;letter-spacing:.1em;color:var(--texte);text-decoration:none}
.haut nav{display:flex;flex-wrap:wrap;gap:2px;flex:1}
.haut nav a{color:var(--doux);text-decoration:none;padding:6px 10px;font-weight:500}
.haut nav a:hover,.haut nav a[aria-current]{color:var(--texte);background:var(--fond3);clip-path:var(--pan-btn)}
.moi{display:flex;gap:10px;align-items:center;color:var(--doux);margin:0}

.carte{background:var(--fond2);border:1px solid var(--ligne);clip-path:var(--pan);padding:16px 18px;min-width:0}
.carte.alerte{border-color:var(--orange)}
.etroite{max-width:440px;margin:8vh auto 0;width:100%}
.deux{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:16px}
.ligne{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ligne h1{margin:0}
.flash{margin:0;padding:10px 14px;border-left:3px solid var(--vert);background:var(--fond2)}
.flash.erreur{border-color:var(--rouge)}

.btn{font:600 13px var(--titre);text-transform:uppercase;letter-spacing:.06em;color:#fff;background:var(--accent);border:0;padding:9px 16px;cursor:pointer;clip-path:var(--pan-btn)}
.btn:hover{filter:brightness(1.15)}.btn.second{background:var(--fond3);color:var(--texte)}.btn.danger{background:#b4323a}
.lien{background:none;border:0;color:var(--accent);cursor:pointer;padding:0 4px;font:inherit;text-decoration:underline}
input,select{font:inherit;color:var(--texte);background:var(--fond);border:1px solid var(--ligne);padding:8px 10px;min-width:0}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}
label{display:flex;flex-direction:column;gap:4px;color:var(--doux);font-size:13px}
label.choix{flex-direction:row;align-items:center;gap:8px;color:var(--texte)}
.pile{display:flex;flex-direction:column;gap:12px}
.rangee{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-bottom:10px}
.rangee input:not([type=number]){flex:1 1 200px}
.enligne{display:inline;margin:0}
.boutons{display:flex;flex-wrap:wrap;gap:8px}.boutons form{margin:0}
.recherche{display:flex;gap:8px;max-width:480px}.recherche input{flex:1}
.cle{font:600 18px var(--mono);letter-spacing:.08em;background:var(--fond);padding:10px 12px;word-break:break-all;user-select:all}
.onglets{display:flex;gap:4px;flex-wrap:wrap}
.onglets a{padding:5px 12px;background:var(--fond2);color:var(--doux);text-decoration:none;clip-path:var(--pan-btn)}
.onglets a[aria-current]{background:var(--accent);color:#fff}

.grille-serveurs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.serveur{text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:8px}
.serveur:hover{border-color:var(--accent)}
.etat{font:600 11px var(--titre);text-transform:uppercase;letter-spacing:.08em;padding:2px 8px;margin-left:auto}
.etat.ok{background:color-mix(in srgb,var(--vert) 18%,transparent);color:var(--vert)}
.etat.att{background:color-mix(in srgb,var(--orange) 18%,transparent);color:var(--orange)}
.etat.off{background:var(--fond3);color:var(--doux)}
.etat.err{background:color-mix(in srgb,var(--rouge) 18%,transparent);color:var(--rouge)}
.chiffres{display:grid;grid-template-columns:repeat(2,1fr);gap:6px 12px;margin:0}
.chiffres.large{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.chiffres dt{color:var(--doux);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.chiffres dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.jauge{height:4px;background:var(--fond3);display:block}.jauge i{display:block;height:100%;background:var(--accent)}

.graphe{margin:0}
.courbe{width:100%;height:160px;display:block;background:var(--fond)}
.courbe polyline{fill:none;stroke-width:2;vector-effect:non-scaling-stroke}
.courbe .grille{stroke:var(--ligne);stroke-width:1;vector-effect:non-scaling-stroke}
.graphe figcaption{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;margin-top:6px}
.c0{stroke:#8b5cf6;color:#a78bfa}.c1{stroke:#22d3ee;color:#22d3ee}.c2{stroke:#4ade80;color:#4ade80}.c3{stroke:#f5c542;color:#f5c542}
.c4{stroke:#fb923c;color:#fb923c}.c5{stroke:#f472b6;color:#f472b6}.c6{stroke:#60a5fa;color:#60a5fa}.c7{stroke:#e5e7eb;color:#e5e7eb}

.terminal{background:#05070a;color:#d6dbe5;font:12px/1.45 var(--mono);height:420px;overflow:auto;padding:10px;margin:0 0 8px;white-space:pre-wrap;word-break:break-word}
.terminal .warn{color:var(--orange)}.terminal .err{color:var(--rouge)}
.commande{display:flex;gap:8px;align-items:center;font-family:var(--mono)}.commande input{flex:1;font-family:var(--mono)}

.defile{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--ligne);white-space:nowrap}
th{color:var(--doux);font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.liste{list-style:none;margin:0;padding:0;max-height:420px;overflow:auto}
ol.liste{list-style:decimal inside}
.liste li{padding:6px 0;border-bottom:1px solid var(--ligne)}
.liste time{color:var(--doux);font-variant-numeric:tabular-nums;margin-right:6px}
.joueurs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px}
.joueurs a{display:inline-flex;align-items:center;gap:8px}
.tete{image-rendering:pixelated;vertical-align:middle}
.pill{display:inline-block;font:600 11px var(--titre);text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;color:var(--c,var(--texte));background:color-mix(in srgb,var(--c,var(--texte)) 16%,transparent)}

.inventaires{display:flex;flex-wrap:wrap;gap:16px}
.inventaire{margin:0}.inventaire figcaption{color:var(--doux);font-size:12px;margin-bottom:4px}
.cases{display:grid;grid-template-columns:repeat(9,52px);gap:3px}
.case{width:52px;height:52px;background:var(--fond);border:1px solid var(--ligne);position:relative;overflow:hidden;cursor:default}
.case i{font-style:normal;font-size:9px;line-height:1.1;padding:3px;display:block;color:var(--doux);word-break:break-word}
.case.mod{border-color:color-mix(in srgb,var(--accent) 60%,var(--ligne))}.case.mod i{color:var(--texte)}
.case.ench{box-shadow:inset 0 0 10px color-mix(in srgb,var(--accent) 45%,transparent)}
.case b{position:absolute;right:3px;bottom:1px;font-size:12px}
@media (max-width:560px){.cases{grid-template-columns:repeat(9,1fr);width:calc(100vw - 72px)}.case{width:auto;height:auto;aspect-ratio:1}}