/* Pointer-transparent catalogue detail, separate from the live combat numbers. */
.combatant-hover-preview {
  position:fixed;
  z-index:80;
  width:min(510px,calc(100vw - 24px));
  transform-origin:top left;
  pointer-events:none;
  color:#efe5d2;
  font-family:var(--font-ui,system-ui,sans-serif);
  filter:drop-shadow(0 18px 35px #000c);
}
.combatant-preview-card {
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  min-height:330px;
  border:2px solid #b79966;
  border-right-color:#776141;
  border-bottom:5px solid #59452d;
  border-radius:5px 14px 5px 14px;
  background:linear-gradient(135deg,#363932,#172023 48%,#101719);
  box-shadow:inset 0 0 0 3px #131914,inset 0 0 0 4px #d4b78542;
  overflow:hidden;
}
.combatant-preview-art { position:relative; min-height:330px; isolation:isolate; background:#182022; border-right:1px solid #a48e5d6e; }
.combatant-preview-art .portrait { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 24%; }
.combatant-preview-art::after { content:''; position:absolute; inset:0; z-index:0; background:linear-gradient(180deg,#0a111933,transparent 48%,#0c1317ed 86%,#0c1317); pointer-events:none; }
.combatant-preview-stars { position:absolute; z-index:1; top:13px; right:12px; color:#f2d49a; filter:drop-shadow(0 2px 3px #000); }
.combatant-preview-title { position:absolute; z-index:1; inset:auto 13px 17px; }
.combatant-preview-title>span { font-size:9px; letter-spacing:1.2px; text-transform:uppercase; color:#dac49b; }
.combatant-preview-title h2 { font:700 29px/1.05 var(--font-display,'Arial Narrow',sans-serif); text-transform:uppercase; letter-spacing:.3px; color:#fff0d4; margin:8px 0 0; text-shadow:0 2px 3px #000; overflow-wrap:break-word; }
.combatant-preview-info { min-width:0; padding:17px 16px; }
.combatant-preview-info>.race-badge { font-size:10px; padding:4px 7px; }
.combatant-preview-stats { display:flex; gap:22px; margin:15px 0 16px; padding-bottom:13px; border-bottom:1px solid #bba16e42; }
.combatant-preview-stats>span { display:grid; grid-template-columns:18px auto; align-items:center; gap:2px 6px; color:#b7d9db; }
.combatant-preview-stats>span:nth-child(2) { color:#e4b391; }
.combatant-preview-stats .stat-icon { width:18px; height:18px; }
.combatant-preview-stats b { font:700 35px/.95 var(--font-display,'Arial Narrow',sans-serif); color:#f2e4c9; }
.combatant-preview-stats small { grid-column:1/-1; font-size:8px; letter-spacing:.75px; color:#b9bdb2; }
.combatant-preview-info section+section { margin-top:16px; padding-top:13px; border-top:1px solid #b7a16c2b; }
.combatant-preview-info h3 { font:700 13px/1.1 var(--font-display,'Arial Narrow',sans-serif); letter-spacing:1.1px; color:#d8bd87; margin:0 0 7px; }
.combatant-preview-info p { font-size:12px; line-height:1.5; color:#f3e6cf; margin:0; overflow-wrap:break-word; }
.combatant-preview-info section>small { display:block; margin-top:7px; font-size:10px; line-height:1.5; color:#b6c1b9; }
@media (max-height:600px) {
  .combatant-hover-preview { width:min(565px,calc(100vw - 24px)); }
  .combatant-preview-card { min-height:270px; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); }
  .combatant-preview-art { min-height:270px; }
  .combatant-preview-info { padding:12px; }
  .combatant-preview-stats { margin:10px 0; padding-bottom:8px; }
  .combatant-preview-info section+section { margin-top:10px; padding-top:9px; }
  .combatant-preview-info p { font-size:11px; line-height:1.4; }
  .combatant-preview-info section>small { font-size:10px; line-height:1.35; }
}
@media (hover:none), (pointer:coarse), (max-width:700px) { .combatant-hover-preview { display:none; } }