/* ============================================================
   ASTRA GENESIS, 18-hangar.css
   v0.75.0, écran HANGAR refondu (plaquette visuelle). Cadre commun
   Quêtes/Expéditions/Recherche (.qx-wrap, .qx-head, .qx-card, bouton
   héros, css/11-quests.css) ; ce fichier ne porte que la grille de
   l'écran, ses onglets et ses composants propres. Réglages :
   js/00zh-hangar-layout.js. Remplace la section "HANGAR, PASSE HANGAR
   (v0.53.0)" de css/design-system.css.
   Charte formulaires (CLAUDE.md) : fond #121C2B, bordure #1E2E40,
   focus teal, arrondi 8-10, chiffres en JetBrains Mono. Aucun WebGL.
   ============================================================ */

/* ---------- raretés : une variable par élément, tout en hérite ---------- */
.hg-screen .r-commun{--hg-r:#9FB2CC;}
.hg-screen .r-rare{--hg-r:#4D8CFF;}
.hg-screen .r-epique{--hg-r:#B177FF;}
.hg-screen .r-legendaire{--hg-r:#FFBF3C;}
.hg-screen .r-mythique{--hg-r:#F87171;}
/* tons partagés : intégrité et état de la défense (AG.hgTone) */
.hg-screen .t-good{--hg-t:#2DD4BF;}
.hg-screen .t-warn{--hg-t:#F59E0B;}
.hg-screen .t-bad{--hg-t:#F87171;}
.hg-tone{color:var(--hg-t, var(--ink-1));}

/* ---------- fonds : couche FUSION en fondu enchaîné, aucun voile ---------- */
.hg-stage-alt{
  position:absolute;inset:0;opacity:0;
  background:var(--hg-alt-bg, none) center / cover no-repeat;
  transition:opacity var(--hg-fade, 300ms) ease;
}
#hg-wrap[data-tab="fusion"] .hg-stage-alt.has-bg{opacity:1;}

/* ---------- en-tête : onglets en pills (teal actif) ---------- */
.hg-screen button.pill-tab{font:inherit;font-family:var(--font-head);font-size:.72rem;}
.hg-screen .qx-screen-tabs{margin-left:18px;}

/* ---------- grille : gauche | centre | droite ---------- */
.hg-body{
  position:relative;z-index:20;flex:1 1 auto;min-height:0;
  display:grid;grid-template-columns:var(--qx-left-w) minmax(0,1fr) var(--qx-right-w);gap:var(--qx-gap);
}
.hg-col-left{grid-column:1;}
.hg-center{grid-column:2;min-width:0;min-height:0;display:flex;flex-direction:column;gap:var(--qx-gap);overflow-y:auto;}
.hg-col-right{grid-column:3;}
/* un bloc par onglet : data-tab sur #hg-wrap, data-pane sur le bloc */
#hg-wrap[data-tab="fleet"] .hg-only:not([data-pane~="fleet"]),
#hg-wrap[data-tab="defense"] .hg-only:not([data-pane~="defense"]),
#hg-wrap[data-tab="fusion"] .hg-only:not([data-pane~="fusion"]),
#hg-wrap[data-tab="chantier"] .hg-only:not([data-pane~="chantier"]){display:none !important;}
.hg-screen [role="button"]:focus-visible, .hg-screen .hg-select:focus-visible{outline:2px solid #2DD4BF;outline-offset:2px;}
.hg-mt{margin-top:8px;}
.hg-sect{margin:10px 0 5px;font-family:var(--font-mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);}
.hg-sect-row{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.hg-info{display:flex;gap:6px;align-items:flex-start;}
.hg-info svg{flex:none;width:13px;height:13px;color:var(--cyan);margin-top:1px;}
.hg-link{margin-top:8px;display:inline-block;}

/* ---------- composants partagés ---------- */
.hg-bar{height:5px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:4px;}
.hg-bar > i{display:block;height:100%;border-radius:inherit;background:var(--hg-t, var(--cyan));transition:width .6s ease;}
.hg-kv{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:.68rem;color:var(--ink-2);}
.hg-kv b{font-family:var(--font-mono);font-weight:500;color:var(--ink-1);}
.hg-power{color:var(--cyan) !important;cursor:help;}
.hg-cls-letter{
  flex:none;width:26px;height:26px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:.9rem;color:var(--ink-1);
  background:#121C2B;border:1px solid color-mix(in srgb, var(--hg-r, #2DD4BF) 55%, #1E2E40);
}
.hg-cls-letter.lg{width:34px;height:34px;font-size:1.15rem;border-radius:9px;}
.hg-rar-badge{
  position:absolute;top:6px;right:6px;z-index:2;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.06em;text-transform:uppercase;
  padding:2px 7px;border-radius:7px;color:var(--hg-r, var(--ink-2));border:1px solid var(--hg-r, #1E2E40);background:rgba(4,8,16,.72);
}
.hg-card-names{display:flex;flex-direction:column;min-width:0;}
.hg-card-names b{font-family:var(--font-head);font-weight:600;font-size:.84rem;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-card-names small{font-size:.64rem;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-thumb{
  position:relative;flex:none;width:40px;height:32px;border-radius:7px;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;
  background:#0B1422;border:1px solid color-mix(in srgb, var(--hg-r, #1E2E40) 55%, #1E2E40);color:var(--ink-2);
}
.hg-thumb svg{width:16px;height:16px;}
.hg-thumb .ag-art{--art-tint:var(--hg-r, var(--cyan));--art-ph-size:.8rem;}
.hg-status{
  display:inline-flex;align-items:center;gap:5px;align-self:flex-start;white-space:nowrap;
  font-family:var(--font-mono);font-size:.6rem;padding:2px 7px;border-radius:7px;border:1px solid #1E2E40;color:var(--ink-2);background:#0B1422;
}
.hg-status svg{width:11px;height:11px;flex:none;}
.hg-status.s-mission{color:#F59E0B;border-color:rgba(245,158,11,.4);}
.hg-status.s-garrison{color:#2DD4BF;border-color:rgba(45,212,191,.45);}
.hg-status.s-chantier{color:#A78BFA;border-color:rgba(167,139,250,.45);}
.hg-tag{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:6px;border:1px solid #1E2E40;color:var(--ink-2);white-space:nowrap;}
.hg-tag.t-defense{color:#F87171;border-color:rgba(248,113,113,.4);}
.hg-tag.t-recon{color:#38BDF8;border-color:rgba(56,189,248,.4);}
.hg-tag.t-support{color:#A3E635;border-color:rgba(163,230,53,.4);}
.hg-lock{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:.6rem;color:var(--ink-2);white-space:nowrap;}
.hg-lock svg{width:11px;height:11px;flex:none;}
.hg-motif{margin:6px 0 0;font-size:.64rem;line-height:1.4;color:var(--ink-2);}
.hg-motif.ko{color:#FCA5A5;}
.hg-x{
  flex:none;margin-left:auto;width:22px;height:22px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;
  font-size:.9rem;line-height:1;color:var(--ink-2);background:#121C2B;border:1px solid #1E2E40;cursor:pointer;transition:color .15s, border-color .15s;
}
.hg-x:hover{color:#F87171;border-color:rgba(248,113,113,.6);}
/* bouton désactivé : l'enveloppe reçoit le survol et porte le motif */
.hg-btn-wrap{display:inline-flex;min-width:0;}
.hg-btn-wrap > button{flex:1;}
.hg-btn-wrap > button:disabled{pointer-events:none;}
.hg-btn-wrap[data-tip]{cursor:not-allowed;}
.btn.qx-hero.hg-hero{width:100%;justify-content:center;gap:8px;margin-top:10px;padding-top:calc(10px*var(--scale));padding-bottom:calc(10px*var(--scale));}
.hg-btn-wrap:has(> .hg-hero){display:flex;width:100%;}
.hg-costs{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:10px;}
.hg-costs-lbl{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-right:4px;}
.hg-per{font-family:var(--font-mono);font-size:.56rem;color:var(--ink-3);align-self:center;}

/* ---------- hexagones de gènes (tooltip unifié) ---------- */
.hg-genes{display:flex;gap:4px;flex-wrap:wrap;}
.hg-gene-hex{
  position:relative;flex:none;width:calc(26px*var(--scale));height:calc(23px*var(--scale));
  clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0% 50%);
  display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.6rem;font-weight:700;cursor:help;
}
.hg-gene-hex.g-D{background:rgba(248,113,113,.22);color:#FCA5A5;}
.hg-gene-hex.g-C{background:rgba(245,158,11,.22);color:#FBBF24;}
.hg-gene-hex.g-B{background:rgba(56,189,248,.22);color:#7DD3FC;}
.hg-gene-hex.g-A{background:rgba(74,222,128,.22);color:#86EFAC;}
.hg-gene-hex.g-S{background:rgba(45,212,191,.32);color:#5EEAD4;}
.hg-gene-hex.g-SS{background:rgba(45,212,191,.55);color:#fff;}
.hg-legend-btn{
  flex:none;margin-left:6px;width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:.64rem;font-weight:700;color:var(--cyan);background:#121C2B;border:1px solid rgba(45,212,191,.45);cursor:pointer;
}
.hg-legend-btn:hover{background:rgba(45,212,191,.15);}
.qx-card .panel-head .hg-legend-btn + .panel-collapse{margin-left:6px;}
.qx-card .panel-head .eyebrow + .hg-legend-btn{margin-left:8px;}
.hg-popover{
  position:absolute;z-index:60;width:min(300px, calc(100% - 16px));padding:10px 12px;border-radius:10px;
  background:#0B1422;border:1px solid #1E2E40;box-shadow:0 12px 32px rgba(0,0,0,.55);
}
.hg-popover[hidden]{display:none;}
.hg-pop-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-family:var(--font-head);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-1);}
.hg-pop-gene{display:flex;flex-direction:column;padding:4px 0;border-bottom:1px dashed rgba(255,255,255,.06);}
.hg-pop-gene b{font-size:.72rem;color:var(--ink-1);}
.hg-pop-gene small{font-size:.64rem;color:var(--ink-2);line-height:1.35;}
.hg-pop-grades{display:grid;grid-template-columns:repeat(6, 1fr);gap:4px;margin-top:8px;text-align:center;}
.hg-pop-grades > span{display:flex;flex-direction:column;align-items:center;gap:2px;}
.hg-pop-grades small{font-family:var(--font-mono);font-size:.56rem;color:var(--ink-3);}
.hg-pop-grades .hg-gene-hex{cursor:default;}

/* ---------- champs : recherche, tri, chips ---------- */
.hg-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:calc(8px*var(--scale)) calc(12px*var(--scale)) 0;}
.hg-search{position:relative;display:block;flex:1 1 160px;min-width:140px;max-width:280px;}
.hg-search svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:13px;height:13px;color:var(--ink-3);pointer-events:none;}
.hg-search input{
  width:100%;background:#121C2B;border:1px solid #1E2E40;border-radius:8px;color:#E6EDF5;
  font-size:.74rem;padding:6px 10px 6px 28px;transition:border-color .15s;
}
.hg-search input:hover{border-color:rgba(45,212,191,.45);}
.hg-search input:focus{outline:none;border-color:#2DD4BF;}
.hg-search input::placeholder{color:var(--ink-3);}
.hg-sort{display:inline-flex;align-items:center;gap:6px;margin-left:auto;}
.hg-sort-lbl{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}
.hg-select{
  appearance:none;-webkit-appearance:none;background:#121C2B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237C8DA6' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center / 12px;
  border:1px solid #1E2E40;border-radius:8px;color:#E6EDF5;font-family:var(--font-head);font-size:.74rem;padding:5px 28px 5px 10px;cursor:pointer;transition:border-color .15s;
}
.hg-select:hover{border-color:rgba(45,212,191,.45);}
.hg-select:focus{outline:none;border-color:#2DD4BF;}
.hg-select option{background:#121C2B;color:#E6EDF5;}
.hg-chips{display:flex;flex-wrap:wrap;gap:5px;}
.hg-chip{
  font-family:var(--font-mono);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;padding:4px 9px;border-radius:999px;cursor:pointer;
  color:var(--hg-r, var(--ink-2));background:#121C2B;border:1px solid #1E2E40;transition:border-color .15s, background .15s;
}
.hg-chip:hover{border-color:var(--hg-r, #2DD4BF);}
.hg-chip.sel{background:#2DD4BF;border-color:#2DD4BF;color:#04201C;}

/* ---------- colonne gauche ---------- */
.hg-power-big{display:flex;flex-direction:column;cursor:help;}
.hg-power-big b{font-family:var(--font-mono);font-weight:500;font-size:1.7rem;line-height:1.1;color:var(--cyan);}
.hg-power-big span{font-family:var(--font-head);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);}
.hg-rar-chips{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:8px;}
.hg-rar-chip{display:inline-flex;align-items:center;gap:6px;min-width:0;font-family:var(--font-mono);font-size:.62rem;color:var(--ink-1);
  padding:3px 7px;border-radius:7px;background:#0B1422;border:1px solid color-mix(in srgb, var(--hg-r) 35%, #1E2E40);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hg-rar-chip i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--hg-r);box-shadow:0 0 6px var(--hg-r);}
.hg-mission-list{display:flex;flex-direction:column;gap:6px;}
.hg-mission{display:flex;align-items:center;gap:8px;min-width:0;padding:4px;border-radius:8px;cursor:pointer;border:1px solid transparent;transition:background .15s, border-color .15s;}
.hg-mission:hover{background:rgba(255,255,255,.04);border-color:#1E2E40;}
.hg-mission-txt{flex:1;min-width:0;display:flex;flex-direction:column;}
.hg-mission-txt b{font-size:.74rem;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-mission-txt small{font-size:.62rem;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-mission-eta{flex:none;font-family:var(--font-mono);font-size:.64rem;color:#F59E0B;}
.hg-status-list{display:flex;flex-direction:column;gap:3px;}
.hg-status-row{
  display:flex;align-items:center;gap:8px;width:100%;padding:6px 8px;border-radius:8px;cursor:pointer;text-align:left;
  font:inherit;font-size:.72rem;color:var(--ink-1);background:transparent;border:1px solid transparent;transition:background .15s, border-color .15s;
}
.hg-status-row svg{width:14px;height:14px;flex:none;color:var(--ink-2);}
.hg-status-row span{flex:1;min-width:0;}
.hg-status-row b{font-family:var(--font-mono);font-weight:500;color:var(--ink-2);}
.hg-status-row:hover{background:rgba(255,255,255,.04);border-color:#1E2E40;}
.hg-status-row.sel{background:rgba(45,212,191,.1);border-color:rgba(45,212,191,.5);}
.hg-status-row.sel svg, .hg-status-row.sel b{color:#2DD4BF;}
.hg-immune{display:flex;align-items:center;gap:8px;margin-top:10px;padding:8px 10px;border-radius:8px;font-size:.7rem;color:var(--ink-1);
  background:rgba(45,212,191,.07);border:1px solid rgba(45,212,191,.35);}
.hg-immune svg{width:16px;height:16px;flex:none;color:#2DD4BF;}
.hg-immune b{font-family:var(--font-mono);font-weight:500;color:#2DD4BF;}

/* ---------- FLOTTE : grille de cartes, zone flexible, largeur au contenu ---------- */
#hg-panel-ships{
  --hg-card-w:224px;--agc-card-w:var(--hg-card-w);--agc-card-gap:10px;--agc-fitw-extra:calc(24px*var(--scale) + 2px);
  flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-self:flex-start;min-width:min(100%, 380px);
}
#hg-panel-ships.agc-fitw{min-width:min(100%, 380px);}
#hg-panel-ships > .hg-grid-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;}
.hg-grid{display:grid;grid-template-columns:repeat(auto-fill, var(--hg-card-w));gap:10px;align-content:start;}
.hg-grid.empty{display:block;}
.hg-card{
  --hg-r:#1E2E40;position:relative;min-width:0;display:flex;flex-direction:column;border-radius:10px;overflow:hidden;cursor:pointer;
  background:rgba(8,14,24,.78);border:1px solid #1E2E40;border-top:2px solid var(--hg-r);
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
.hg-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb, var(--hg-r) 65%, #1E2E40);}
.hg-card.sel{border-color:#2DD4BF;box-shadow:0 0 0 1px #2DD4BF, 0 0 18px rgba(45,212,191,.35);}
.hg-card-build{cursor:default;opacity:.92;}
.hg-card-build:hover{transform:none;}
.hg-card-art{position:relative;height:calc(92px*var(--scale));
  background:linear-gradient(160deg, color-mix(in srgb, var(--hg-r) 32%, transparent), transparent 75%), #0B1422;}
.hg-card-art .ag-art{--art-tint:var(--hg-r);--art-ph-size:calc(34px*var(--scale));}
.hg-card-body{display:flex;flex-direction:column;gap:5px;padding:calc(8px*var(--scale)) calc(10px*var(--scale)) calc(10px*var(--scale));}
.hg-card-id{display:flex;align-items:center;gap:8px;min-width:0;}

/* VAISSEAU SÉLECTIONNÉ */
.hg-sel, .hg-modal{display:flex;flex-direction:column;gap:6px;min-width:0;}
.hg-sel-art{position:relative;height:calc(130px*var(--scale));border-radius:10px;overflow:hidden;border:1px solid color-mix(in srgb, var(--hg-r) 45%, #1E2E40);
  background:radial-gradient(ellipse at 50% 55%, color-mix(in srgb, var(--hg-r) 30%, transparent), transparent 70%), #0B1422;}
.hg-sel-art .ag-art{--art-tint:var(--hg-r);--art-ph-size:calc(48px*var(--scale));}
.hg-sel-id{margin-top:4px;}
.hg-sel-id .hg-card-names b{font-size:1rem;}
.hg-sel-role{margin:0;font-size:.7rem;line-height:1.4;color:var(--ink-2);}
.hg-sel-stats{display:flex;flex-direction:column;gap:3px;padding:6px 8px;border-radius:8px;background:#0B1422;border:1px solid #1E2E40;}
.hg-sel-stats .qx-kv b{font-family:var(--font-mono);font-weight:500;color:var(--ink-1);}
.hg-details-btn{width:100%;justify-content:center;gap:6px;margin-top:8px;border-color:rgba(45,212,191,.55);color:#2DD4BF;letter-spacing:.08em;text-transform:uppercase;}
.hg-details-btn svg{width:13px;height:13px;}
.hg-sel-actions{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:6px;margin-top:6px;}
.hg-act-btn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;padding:8px 4px;border-radius:8px;cursor:pointer;
  font-family:var(--font-head);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-1);
  background:#121C2B;border:1px solid #1E2E40;transition:border-color .15s, background .15s, color .15s;
}
.hg-act-btn svg{width:16px;height:16px;color:var(--ink-2);}
.hg-act-btn:hover:not(:disabled){border-color:#2DD4BF;color:#2DD4BF;}
.hg-act-btn:hover:not(:disabled) svg{color:#2DD4BF;}
.hg-act-btn.on{background:rgba(45,212,191,.12);border-color:rgba(45,212,191,.6);}
.hg-act-btn:disabled{opacity:.45;}
.hg-repair-ship{width:100%;justify-content:center;margin-top:10px;}

/* ---------- DÉFENSE ---------- */
.hg-duo{display:grid;grid-template-columns:repeat(auto-fit, minmax(min(100%, 340px), 1fr));gap:var(--qx-gap);align-items:start;}
.hg-def-power{display:flex;align-items:center;gap:12px;padding:6px 4px 10px;cursor:help;}
.hg-def-shield{flex:none;width:44px;height:44px;color:#2DD4BF;filter:drop-shadow(0 0 10px rgba(45,212,191,.45));}
.hg-def-shield svg{width:100%;height:100%;}
.hg-def-power b{display:block;font-family:var(--font-mono);font-weight:500;font-size:1.7rem;line-height:1.1;color:var(--ink-1);}
.hg-def-power small{font-family:var(--font-head);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);}
.hg-rows{display:flex;flex-direction:column;gap:2px;padding-top:6px;border-top:1px solid #1E2E40;}
.hg-rows .qx-kv b{font-family:var(--font-mono);font-weight:500;color:var(--ink-1);}
.hg-rows .qx-kv b.hg-tone{color:var(--hg-t);}
.hg-unit-list{display:flex;flex-direction:column;}
.hg-unit{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"art txt own" "art txt ctl";align-items:center;gap:4px 10px;
  padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.06);}
.hg-unit:last-child{border-bottom:0;}
.hg-unit > .hg-thumb{grid-area:art;width:52px;height:46px;}
.hg-unit-txt{grid-area:txt;display:flex;flex-direction:column;gap:2px;min-width:0;}
.hg-unit-txt b{font-family:var(--font-head);font-weight:600;font-size:.8rem;color:var(--ink-1);cursor:help;}
.hg-unit-txt small{font-size:.64rem;color:var(--ink-2);}
.hg-unit-txt .rs-chips{margin-top:2px;}
.hg-owned{grid-area:own;justify-self:end;font-family:var(--font-mono);font-size:.8rem;color:var(--ink-1);}
.hg-unit-ctl{grid-area:ctl;justify-self:end;display:flex;gap:5px;}
.hg-qty{min-width:50px;justify-content:center;font-family:var(--font-mono);}
.hg-unit.locked > .hg-thumb .ag-art{filter:grayscale(.85) brightness(.7);}
.hg-queue{margin-top:10px;padding:8px 10px;border-radius:8px;background:#0B1422;border:1px solid #1E2E40;}
.hg-queue .qx-kv b{font-family:var(--font-mono);font-weight:500;color:var(--ink-1);}
.hg-cancel{width:100%;justify-content:center;margin-top:8px;}
.hg-gar-list{display:flex;flex-direction:column;gap:6px;}
.hg-gar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"art txt btn" "art chips btn";align-items:center;gap:3px 8px;
  padding:6px;border-radius:9px;background:#0B1422;border:1px solid #1E2E40;transition:border-color .15s;}
.hg-gar.on{border-color:rgba(45,212,191,.55);background:rgba(45,212,191,.06);}
.hg-gar > .hg-thumb{grid-area:art;width:52px;height:40px;}
.hg-gar-txt{grid-area:txt;display:flex;flex-direction:column;min-width:0;}
.hg-gar-txt b{font-size:.74rem;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-gar-txt small{font-family:var(--font-mono);font-size:.6rem;color:var(--ink-2);}
.hg-gar-chips{grid-area:chips;display:flex;flex-wrap:wrap;gap:4px;}
.hg-gar-btn{grid-area:btn;min-width:74px;justify-content:center;}
.hg-gar-btn.on{border-color:rgba(248,113,113,.5);color:#FCA5A5;}

/* ---------- FUSION : chambre sur le décor 7_1 ---------- */
.hg-fusion-center{display:flex;flex-direction:column;gap:var(--qx-gap);flex:1 1 auto;min-height:0;}
.hg-chamber{flex:1 1 auto;min-height:calc(250px*var(--scale));display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr);gap:calc(18px*var(--scale));align-items:center;
  padding:0 calc(6px*var(--scale));}
.hg-core{display:flex;justify-content:center;align-self:end;}
.hg-fslot, .hg-fresult{
  position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;max-width:280px;width:100%;justify-self:center;
  padding:calc(10px*var(--scale)) calc(12px*var(--scale));border-radius:12px;
  background:var(--qx-glass);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));
  border:1px solid color-mix(in srgb, var(--hg-r, #1E2E40) 55%, #1E2E40);box-shadow:var(--shadow-deep);
}
.hg-fslot.empty, .hg-fresult.empty{border-style:dashed;border-color:#1E2E40;}
.hg-fslot-head{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);}
.hg-fslot-head svg{width:13px;height:13px;}
.hg-fslot-id{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:34px;}
.hg-fslot-id .hg-rar-badge{position:static;}
.hg-fslot-art{position:relative;height:calc(80px*var(--scale));border-radius:8px;overflow:hidden;background:#0B1422;}
.hg-fslot-art .ag-art{--art-tint:var(--hg-r);--art-ph-size:calc(30px*var(--scale));}
.hg-fslot-name{font-family:var(--font-head);font-weight:600;font-size:.8rem;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-fslot small, .hg-fresult small{font-size:.66rem;color:var(--ink-2);}
.hg-fslot-genes{display:flex;flex-direction:column;gap:3px;margin-top:4px;}
.hg-fslot-genes > span{display:flex;align-items:center;gap:6px;font-size:.66rem;color:var(--ink-1);}
.hg-fslot-genes em{font-style:normal;}
.hg-fresult{max-width:300px;border-color:color-mix(in srgb, var(--hg-r, #2DD4BF) 70%, transparent);
  box-shadow:0 0 0 1px color-mix(in srgb, var(--hg-r, #2DD4BF) 35%, transparent), 0 0 30px color-mix(in srgb, var(--hg-r, #2DD4BF) 25%, transparent), var(--shadow-deep);}
.hg-fresult.empty{box-shadow:var(--shadow-deep);}
.hg-fresult-head{text-align:center;font-family:var(--font-display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-1);}
.hg-silhouette{position:relative;height:calc(80px*var(--scale));border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(ellipse at 50% 55%, color-mix(in srgb, var(--hg-r, #2DD4BF) 55%, transparent), transparent 70%), #0B1422;}
.hg-silhouette span{font-family:var(--font-display);font-weight:700;font-size:2rem;color:rgba(255,255,255,.85);text-shadow:0 0 18px var(--hg-r, #2DD4BF);}
.hg-fresult-power{font-size:.72rem;color:var(--ink-2);}
.hg-fresult-power b{font-family:var(--font-mono);font-weight:500;color:var(--ink-1);}
#hg-panel-picker{flex:none;}
.hg-picker{display:grid;grid-template-columns:repeat(auto-fill, minmax(128px, 1fr));gap:8px;}
.hg-mini{
  --hg-r:#1E2E40;display:flex;flex-direction:column;gap:2px;min-width:0;padding:6px;border-radius:9px;cursor:pointer;
  background:rgba(8,14,24,.78);border:1px solid color-mix(in srgb, var(--hg-r) 45%, #1E2E40);transition:border-color .15s, box-shadow .15s;
}
.hg-mini:hover{border-color:var(--hg-r);}
.hg-mini.sel{border-color:#2DD4BF;box-shadow:0 0 0 1px #2DD4BF, 0 0 14px rgba(45,212,191,.3);}
.hg-mini-art{position:relative;height:calc(56px*var(--scale));border-radius:6px;overflow:hidden;background:#0B1422;}
.hg-mini-art .ag-art{--art-tint:var(--hg-r);--art-ph-size:1.2rem;}
.hg-mini-art .hg-cls-letter{position:absolute;left:4px;top:4px;z-index:2;width:20px;height:20px;font-size:.7rem;}
.hg-mini-check{position:absolute;right:4px;bottom:4px;z-index:2;width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:.62rem;font-weight:700;color:#04201C;background:#2DD4BF;}
.hg-mini b{font-size:.72rem;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-mini small{font-family:var(--font-mono);font-size:.6rem;color:var(--ink-2);}
/* analyse : le contenu défile, le bouton FUSIONNER et son motif restent
   en pied de panneau (même principe que les Détails de Recherche) */
#hg-wrap[data-tab="fusion"] .hg-col-right{overflow:hidden;}
#hg-panel-analysis{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;}
#hg-panel-analysis.collapsed{flex:0 0 auto;}
#hg-panel-analysis > .panel-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;}
.hg-an{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;}
.hg-an-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;}
.hg-an-foot{flex:none;}
.hg-chances{display:flex;flex-direction:column;gap:4px;cursor:help;}
.hg-chance{display:grid;grid-template-columns:minmax(0,1fr) minmax(60px,1.4fr) 44px;align-items:center;gap:8px;font-size:.68rem;color:var(--ink-1);}
.hg-chance span{display:flex;align-items:center;gap:6px;min-width:0;}
.hg-chance span i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--hg-r);}
.hg-chance .hg-bar{margin:0;}
.hg-chance .hg-bar > i{background:var(--hg-r);}
.hg-chance b{text-align:right;font-family:var(--font-mono);font-weight:500;}
.hg-mut{font-family:var(--font-mono);font-size:.9rem;font-weight:500;color:#2DD4BF;letter-spacing:0;}
.hg-inherit-list{display:flex;flex-direction:column;gap:3px;}
.hg-inherit{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:8px;font-size:.7rem;color:var(--ink-1);cursor:help;}
.hg-inherit small{font-family:var(--font-mono);font-size:.62rem;color:var(--ink-2);}
.hg-inherit b{font-family:var(--font-mono);font-weight:500;min-width:44px;text-align:right;}
.hg-irrev{margin-top:6px;text-align:center;font-style:italic;}
.hg-btn-wrap:has(> .hg-fuse-btn){display:flex;width:100%;}

/* ---------- CHANTIER ---------- */
.hg-stack{display:flex;flex-direction:column;gap:var(--qx-gap);}
.hg-slots{display:grid;grid-template-columns:repeat(auto-fit, minmax(min(100%, 280px), 1fr));gap:8px;}
.hg-slot{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 10px;border-radius:10px;background:#0B1422;border:1px solid #1E2E40;}
.hg-slot.busy{border-color:rgba(45,212,191,.35);}
.hg-slot.free{border-style:dashed;}
.hg-slot > .hg-thumb{width:64px;height:46px;}
.hg-slot-plus{flex:none;width:46px;height:46px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:var(--ink-3);border:1px dashed #1E2E40;}
.hg-slot-plus svg{width:18px;height:18px;}
.hg-slot-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.hg-slot-main b{font-family:var(--font-head);font-weight:600;font-size:.8rem;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hg-slot-main small{font-size:.64rem;color:var(--ink-2);}
.hg-slot-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0;}
.hg-slot-time{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.66rem;color:var(--ink-1);}
.hg-slot-time svg{width:12px;height:12px;color:var(--cyan);flex:none;}
.hg-slot-pct{margin-left:auto;color:var(--ink-2);}
.hg-table{display:flex;flex-direction:column;}
.hg-tr{display:grid;align-items:center;gap:8px 12px;padding:7px 0;border-bottom:1px dashed rgba(255,255,255,.06);min-width:0;}
.hg-tr:last-child{border-bottom:0;}
.hg-th{padding-top:0;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);}
.hg-table-ships .hg-tr{grid-template-columns:minmax(200px,1.6fr) minmax(0,1.3fr) minmax(76px,.6fr) minmax(104px,.7fr) auto;}
.hg-table-def .hg-tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name name" "cost act";}
.hg-table-def .hg-lock{white-space:normal;text-align:right;}
.hg-table-def .hg-td-name{grid-area:name;}
.hg-table-def .rs-chips{grid-area:cost;}
.hg-table-def .hg-td-act{grid-area:act;}
.hg-td-name{display:flex;align-items:center;gap:8px;min-width:0;}
.hg-td-name > .hg-thumb{width:52px;height:40px;}
.hg-td-name .hg-card-names{flex:1;}
.hg-td-name .hg-card-names small{display:inline-flex;align-items:center;gap:4px;}
.hg-td-name .hg-card-names small svg{width:11px;height:11px;color:var(--cyan);}
.hg-td-dur, .hg-td-req{display:flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:.66rem;color:var(--ink-1);white-space:nowrap;}
.hg-td-dur svg, .hg-td-req svg{width:12px;height:12px;flex:none;color:var(--cyan);}
.hg-td-req.ko{color:var(--ink-2);}
.hg-td-req.ko svg{color:#F59E0B;}
.hg-td-act{justify-self:end;}
.hg-build{min-width:96px;justify-content:center;border-color:rgba(45,212,191,.55);color:#2DD4BF;letter-spacing:.06em;text-transform:uppercase;}
.hg-build:hover:not(:disabled){background:rgba(45,212,191,.12);}
.hg-yard{display:flex;align-items:center;gap:12px;}
.hg-yard-ic{flex:none;width:52px;height:52px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;color:#2DD4BF;
  background:radial-gradient(circle at 50% 40%, rgba(45,212,191,.25), transparent 70%), #0B1422;border:1px solid rgba(45,212,191,.35);}
.hg-yard-ic svg{width:24px;height:24px;}
.hg-yard-txt{display:flex;flex-direction:column;gap:2px;min-width:0;}
.hg-yard-txt b{font-family:var(--font-display);font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-1);}
.hg-yard-txt small{font-size:.68rem;color:var(--ink-2);line-height:1.35;}
.hg-yard-next{color:var(--ink-3) !important;}

/* ---------- largeurs et hauteurs contraintes (1366 à 3440) ---------- */
@media (max-width: 1600px){
  .hg-table-ships .hg-tr{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"name dur act" "cost req act";}
  .hg-table-ships .hg-th{display:none;}
  .hg-table-ships .hg-td-name{grid-area:name;}
  .hg-table-ships .rs-chips{grid-area:cost;padding-left:60px;}
  .hg-table-ships .hg-td-dur{grid-area:dur;}
  .hg-table-ships .hg-td-req{grid-area:req;}
  .hg-table-ships .hg-td-act{grid-area:act;}
  .hg-td-name .hg-card-names small{display:none;}
}
@media (max-width: 1440px){
  .hg-chamber{gap:10px;}
  .hg-fslot-genes{flex-direction:row;flex-wrap:wrap;gap:4px;}
  .hg-fslot-genes em{display:none;}
  #hg-panel-ships{--hg-card-w:210px;}
}
@media (max-height: 820px){
  .hg-card-art{height:calc(70px*var(--scale));}
  .hg-sel-art{height:calc(64px*var(--scale));}
  .hg-sel{gap:4px;}
  .hg-sel-stats{padding:4px 8px;gap:1px;}
  .hg-sel .hg-sect{margin:6px 0 3px;}
  .hg-details-btn{margin-top:4px;}
  #hg-analysis .hg-sect{margin:7px 0 3px;}
  #hg-analysis .hg-hero{margin-top:8px;padding-top:calc(7px*var(--scale));padding-bottom:calc(7px*var(--scale));}
  .hg-inherit-list, .hg-chances{gap:1px;}
  .hg-fslot-art, .hg-silhouette{height:calc(56px*var(--scale));}
  .hg-chamber{min-height:calc(200px*var(--scale));}
}
@media (min-width: 2200px){
  #hg-panel-ships{--hg-card-w:256px;}
  .hg-fslot, .hg-fresult{max-width:340px;}
}
@media (prefers-reduced-motion: reduce){
  .hg-stage-alt, .hg-card, .hg-bar > i{transition:none !important;}
  .hg-card:hover{transform:none;}
}