/* ==========================================================================
   combat.css -- Combat panel specific styles (two-line card layout)
   ========================================================================== */

/* --- Zone A: Header --- */
.combat-header-inactive {
  color: var(--text-muted);
  font-style: italic;
}

.combat-header-round {
  font-weight: 700;
  color: var(--accent);
  font-size: 1.1rem;
}

.combat-header-sep {
  color: var(--text-muted);
  margin: 0 0.5rem;
}

.combat-header-turn {
  font-size: 1rem;
  color: var(--text);
}

/* --- Workflow Prompt Strip --- */
#combat-workflow {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 0.5rem;
  font-size: 0.78rem;
  overflow: hidden;
}

#combat-workflow[hidden] {
  display: none;
}

.workflow-main {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.5rem;
  min-height: 24px;
}

.workflow-toggle {
  cursor: pointer;
  color: var(--text-muted);
  font-size: 0.85rem;
  flex-shrink: 0;
  transition: transform var(--speed-normal);
  user-select: none;
}

.workflow-expanded .workflow-toggle {
  transform: rotate(90deg);
}

.workflow-text {
  flex: 1;
  color: var(--text-muted);
  font-style: italic;
}

.workflow-dismiss {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.7rem;
  padding: 0 0.2rem;
  opacity: 0.5;
  transition: opacity var(--speed-normal);
  flex-shrink: 0;
}

.workflow-dismiss:hover {
  opacity: 1;
  color: var(--danger);
}

.workflow-subs {
  padding: 0 0.5rem 0.25rem 1.5rem;
}

.workflow-sub {
  font-size: 0.72rem;
  color: var(--yellow-warn);
  padding: 0.1rem 0;
}

.workflow-steps {
  padding: 0.25rem 0.5rem 0.4rem 1.5rem;
  border-top: 1px solid var(--border);
}

.workflow-step {
  font-size: 0.72rem;
  color: var(--text-muted);
  padding: 0.1rem 0;
}

.workflow-step-num {
  color: var(--accent);
  font-weight: 600;
}

/* --- Zone B: Combat Card (two-line layout) --- */
.combat-card {
  position: relative;
  border-left: 3px solid transparent;
  transition: background-color var(--speed-normal), border-left-color var(--speed-normal), opacity var(--speed-normal);
  padding: 0;
}

.combat-card:nth-child(odd) { background: var(--surface); }
.combat-card:nth-child(even) { background: var(--bg-raised); }

/* PC cards: blue left border */
.combat-card.pc-card {
  border-left-color: var(--pc-accent);
}

/* NPC cards: red left border */
.combat-card.npc-card {
  border-left-color: var(--npc-accent);
}

/* Active turn highlight */
.combat-card.active-turn {
  border-left-color: var(--accent) !important;
  background: rgba(217, 119, 6, 0.08) !important;
}

/* Dead/unconscious NPCs */
.combat-card.dead-npc {
  opacity: 0.5;
}

.combat-card.dead-npc .card-name {
  text-decoration: line-through;
}

/* Drag states */
.combat-card.dragging {
  opacity: 0.4;
  background: var(--surface-light);
}

.combat-card.drag-over {
  border-top: 2px solid var(--accent);
}

/* --- Line 1: Always visible --- */
.card-line1 {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.6rem;
  cursor: pointer;
  min-height: 2.2rem;
}

.card-line1 .drag-handle {
  cursor: grab;
  color: var(--text-muted);
  font-size: 0.85rem;
  user-select: none;
  opacity: 0.4;
  transition: opacity var(--speed-normal);
  flex-shrink: 0;
}

.combat-card:hover .drag-handle {
  opacity: 1;
}

.card-init {
  min-width: 1.8rem;
  font-weight: 700;
  color: var(--accent);
  text-align: center;
  font-size: 1rem;
  flex-shrink: 0;
}

.card-name {
  flex: 1;
  font-weight: 500;
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.npc-card .card-name {
  font-style: italic;
  color: var(--text-muted);
}

.active-star {
  color: var(--accent);
  font-size: 0.8rem;
}

.card-ac {
  font-size: 0.72rem;
  padding: 0.1rem 0.35rem;
  flex-shrink: 0;
}

.card-ac.has-cover {
  border: 1px solid var(--accent) !important;
}

/* --- HP section in line 1 --- */
.card-hp-wrap {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  flex-shrink: 0;
}

.card-hp-btn {
  padding: 0.1rem 0.35rem;
  font-size: 0.8rem;
  min-width: auto;
  line-height: 1;
}

.card-hp-bar-outer {
  width: 3rem;
  height: 5px;
  background: var(--bg-dark);
  border-radius: 3px;
  overflow: hidden;
  flex-shrink: 0;
}

.card-hp-bar-inner {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}

.card-hp-bar-inner.hp-high { background: var(--success); }
.card-hp-bar-inner.hp-mid  { background: var(--yellow-warn); }
.card-hp-bar-inner.hp-low  { background: var(--danger); }

.card-hp-text {
  font-weight: 700;
  font-size: 0.78rem;
  min-width: 3rem;
  text-align: center;
  flex-shrink: 0;
}

.card-remove-btn {
  margin-left: auto;
  padding: 0.1rem 0.35rem;
  font-size: 0.72rem;
  line-height: 1;
  min-width: auto;
  flex-shrink: 0;
}

/* --- Death saves row --- */
.card-death-saves {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.6rem 0.2rem 3.2rem;
  font-size: 0.75rem;
}

.ds-icon {
  font-size: 0.85rem;
}

.ds-sep {
  color: var(--text-muted);
  margin: 0 0.1rem;
}

.card-ds-btn {
  padding: 0.1rem 0.35rem;
  font-size: 0.7rem;
  min-width: auto;
  line-height: 1;
  margin-left: 0.2rem;
}

.ds-status {
  font-size: 0.7rem;
  font-weight: 700;
  margin-left: 0.3rem;
}

.ds-stable { color: var(--success); }
.ds-dead   { color: var(--danger); }

/* --- Line 2: Expandable details --- */
.card-line2 {
  display: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  padding: 0.25rem 0.6rem 0.35rem 3.2rem;
  border-top: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.1); /* subtle tint on bg, intentional */
}

.card-line2.expanded {
  display: flex;
}

/* --- Action economy buttons --- */
.card-action-economy {
  display: inline-flex;
  gap: 0.2rem;
  align-items: center;
}

.action-econ-btn {
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.1rem 0.25rem;
  border-radius: 3px;
  min-width: auto;
  line-height: 1;
  cursor: pointer;
  border: 1px solid;
  transition: background-color var(--speed-normal) ease, color var(--speed-normal) ease, border-color var(--speed-normal) ease, opacity var(--speed-normal) ease;
  color: #fff;
}

.action-econ-btn.used {
  background: transparent;
  color: var(--text-muted);
  border-color: var(--border);
  opacity: 0.5;
  text-decoration: line-through;
}

/* --- Conditions in line 2 --- */
.card-conditions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.2rem;
}

/* --- Movement badge --- */
.card-movement {
  font-size: 0.72rem;
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
  background: color-mix(in srgb, var(--success) 15%, transparent);
  border: 1px solid color-mix(in srgb, var(--success) 30%, transparent);
  color: var(--text-muted);
  white-space: nowrap;
}

.card-movement.mv-depleted {
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 30%, transparent);
  background: color-mix(in srgb, var(--danger) 10%, transparent);
}

/* --- DR/DV/DI badges --- */
.card-dr-badges {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.15rem;
}

.dr-badge {
  font-size: 0.7rem;
  padding: 0.05rem 0.25rem;
  border-radius: 3px;
}

.dr-badge.dr-resist {
  background: color-mix(in srgb, var(--blue) 20%, transparent);
  color: var(--text-muted);
  border: 1px solid color-mix(in srgb, var(--blue) 30%, transparent);
}

.dr-badge.dr-vuln {
  background: color-mix(in srgb, var(--danger) 20%, transparent);
  color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 30%, transparent);
}

.dr-badge.dr-immune {
  background: color-mix(in srgb, var(--text-muted) 20%, transparent);
  color: var(--text-muted);
  border: 1px solid color-mix(in srgb, var(--text-muted) 40%, transparent);
  font-weight: 600;
}

/* --- Legendary actions --- */
.card-legendary {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.leg-label {
  font-size: 0.7rem;
  color: var(--accent);
  font-weight: 600;
}

.leg-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  cursor: pointer;
  border: 1px solid var(--accent);
  background: transparent;
  transition: background var(--speed-normal);
}

.leg-dot.available {
  background: var(--accent);
}

/* --- Lair badge --- */
.card-lair-badge {
  font-size: 0.72rem;
  font-weight: 600;
  color: #fff;
  background: var(--purple);
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
}

/* --- Ready badge --- */
.card-ready-badge {
  font-size: 0.7rem;
  font-weight: 600;
  color: #fff;
  background: var(--purple);
  padding: 0.1rem 0.25rem;
  border-radius: 3px;
  cursor: pointer;
}

/* --- Action buttons in line 2 --- */
.card-actions {
  display: inline-flex;
  gap: 0.2rem;
  align-items: center;
  margin-left: auto;
}

.card-action-btn {
  padding: 0.1rem 0.3rem;
  font-size: 0.72rem;
  min-width: auto;
  line-height: 1;
}

.card-cond-select {
  padding: 0.15rem 0.25rem;
  font-size: 0.72rem;
  background-color: var(--surface-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 3px;
  cursor: pointer;
  max-width: 6rem;
}

/* --- Popups (shared base) --- */
.combat-popup {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.5rem;
  background: var(--surface-light);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-sm);
  position: absolute;
  z-index: var(--z-dropdown);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  min-width: 12rem;
}

.popup-title {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text);
}

/* --- HP adjust popup --- */
.hp-adjust-popup {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.3rem 0.4rem;
  background: var(--surface-light);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-sm);
  margin-top: 0.3rem;
  flex-wrap: wrap;
}

.hp-adjust-input {
  width: 4rem;
  padding: 0.2rem 0.3rem;
  font-size: 0.8rem;
  text-align: center;
}

/* --- Damage type selector --- */
.dmg-type-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem;
  margin-bottom: 0.2rem;
}

.dmg-type-btn {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.1rem 0.2rem;
  border-radius: 3px;
  min-width: auto;
  line-height: 1;
  cursor: pointer;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-muted);
  transition: background-color var(--speed-fast), color var(--speed-fast), border-color var(--speed-fast);
}

.dmg-type-btn.relevant {
  border-color: var(--accent);
  color: var(--text);
}

.dmg-type-btn.selected {
  background: var(--accent);
  color: var(--bg-dark);
  border-color: var(--accent);
}

.dmg-preview {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.1rem 0;
  min-height: 1rem;
}

.dmg-preview-resistant  { color: var(--blue); }
.dmg-preview-vulnerable { color: var(--danger); }
.dmg-preview-immune     { color: var(--text-muted); }

/* --- Concentration DC reminder --- */
.conc-dc-reminder {
  font-size: 0.72rem;
  color: var(--concentration);
  font-weight: 600;
  padding: 0.15rem 0;
}

/* --- Concentration visual indicator --- */
.combat-card.concentrating {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--concentration) 40%, transparent),
              0 0 6px color-mix(in srgb, var(--concentration) 15%, transparent);
}

.card-conc-badge {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--concentration);
  background: color-mix(in srgb, var(--concentration) 15%, transparent);
  border: 1px solid color-mix(in srgb, var(--concentration) 30%, transparent);
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
  cursor: pointer;
}

/* --- Surprised visual indicator --- */
.combat-card.surprised {
  opacity: 0.7;
}

.card-surprise-badge {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--bg-dark);
  background: var(--yellow-warn);
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
  cursor: pointer;
  text-transform: uppercase;
}

.card-action-btn.surprise-active {
  background: var(--yellow-warn) !important;
  color: var(--bg-dark) !important;
  border-color: var(--yellow-warn) !important;
}

/* --- Exhaustion counter widget --- */
.card-exhaustion {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

.exh-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--exhaustion);
}

.exh-counter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  border: 1px solid var(--border);
  color: var(--text-muted);
  background: transparent;
  transition: background-color var(--speed-normal), color var(--speed-normal), border-color var(--speed-normal);
}

.exh-counter.exh-active {
  background: var(--exhaustion);
  color: #fff;
  border-color: var(--exhaustion);
}

/* --- Rich condition tooltips --- */
.rich-tooltip {
  position: fixed;
  z-index: var(--z-tooltip);
  background: var(--surface-light);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-sm);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
  padding: 0.5rem;
  max-width: 18rem;
  pointer-events: none;
}

.rich-tooltip-title {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 0.2rem;
}

.rich-tooltip-body {
  font-size: 0.72rem;
  color: var(--text);
  line-height: 1.4;
}

.rich-tooltip-hint {
  font-size: 0.7rem;
  color: var(--text-muted);
  font-style: italic;
  margin-top: 0.25rem;
  border-top: 1px solid var(--border);
  padding-top: 0.2rem;
}

/* --- Zone D: Combat Log --- */
#combat-log {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 0.5rem;
  overflow: hidden;
}

#combat-log[hidden] {
  display: none;
}

.combat-log-header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.5rem;
  background: var(--surface);
  cursor: pointer;
  font-size: 0.78rem;
  color: var(--text-muted);
  user-select: none;
}

.log-toggle-arrow {
  font-size: 0.7rem;
}

.log-copy-btn {
  margin-left: auto;
  padding: 0.1rem 0.3rem !important;
  font-size: 0.72rem !important;
  min-width: auto !important;
  line-height: 1 !important;
}

.combat-log-body {
  max-height: 10rem;
  overflow-y: auto;
  padding: 0.25rem 0.5rem;
  background: var(--bg-dark);
}

.log-empty {
  font-size: 0.72rem;
  color: var(--text-muted);
  font-style: italic;
  padding: 0.25rem 0;
}

.log-event {
  font-size: 0.72rem;
  padding: 0.15rem 0;
  color: var(--text);
  display: flex;
  align-items: flex-start;
  gap: 0.3rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

.log-icon {
  flex-shrink: 0;
  font-size: 0.7rem;
}

.log-icon-damage  { color: var(--danger); }
.log-icon-heal    { color: var(--success); }
.log-icon-condition { color: var(--yellow-warn); }
.log-icon-turn    { color: var(--accent); }
.log-icon-death_save { color: var(--danger); }
.log-icon-round   { color: var(--accent); }
.log-icon-combat  { color: var(--text-muted); }

.log-text {
  flex: 1;
  min-width: 0;
  word-wrap: break-word;
}

/* --- Zone C: Controls --- */
.combat-controls-bar {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}

.combat-controls-bar .btn {
  font-size: 0.82rem;
}

/* --- Monster action buttons (from stat block) --- */
.card-monster-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  width: 100%;
  padding: 0.15rem 0;
}

.monster-action-btn {
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.12rem 0.35rem;
  min-width: auto;
  line-height: 1;
  border: 1px solid var(--npc-accent);
  color: var(--npc-accent);
  background: transparent;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color var(--speed-fast), color var(--speed-fast);
  white-space: nowrap;
}

.monster-action-btn:hover {
  background: var(--npc-accent);
  color: #fff;
}

.monster-action-btn.monster-action-multi {
  border-color: var(--accent);
  color: var(--accent);
  font-weight: 700;
}

.monster-action-btn.monster-action-multi:hover {
  background: var(--accent);
  color: #000;
}

.monster-action-btn.monster-action-trait {
  border-color: var(--purple);
  color: var(--purple);
  font-style: italic;
}

.monster-action-btn.monster-action-trait:hover {
  background: var(--purple);
  color: #fff;
}

/* --- Monster attack result display --- */
.monster-attack-result {
  margin-top: 0.3rem;
}

.monster-attack-result:empty {
  display: none;
}

.monster-atk-roll {
  font-size: 0.78rem;
  padding: 0.2rem 0;
}

.atk-crit {
  color: var(--success);
  font-size: 1rem;
}

.atk-fumble {
  color: var(--danger);
}

.atk-crit-label {
  color: var(--success);
  font-weight: 700;
  font-size: 0.82rem;
  text-transform: uppercase;
}

.atk-hit-label {
  color: var(--success);
  font-weight: 700;
}

.atk-miss-label,
.atk-fumble-label {
  color: var(--danger);
  font-weight: 700;
}

.monster-dmg-roll {
  font-size: 0.78rem;
  padding: 0.15rem 0;
}

.monster-dmg-detail {
  font-size: 0.7rem;
  color: var(--text-muted);
}

.monster-apply-dmg {
  margin-top: 0.2rem;
  padding: 0.15rem 0.4rem;
  font-size: 0.72rem;
}

/* --- Reference panel combat button --- */
.ref-combat-btn {
  font-size: 0.78rem !important;
}

.ref-doc-combat-btn {
  font-size: 0.82rem;
  padding: 0.25rem 0.6rem;
  margin-left: auto;
}

/* ==========================================================================
   Spell Resolution UI
   ========================================================================== */

.spell-resolve-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 100000;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
}

.spell-resolve-dialog {
  background: var(--surface, #1e1c1a);
  border: 1px solid var(--border, rgba(200,200,220,0.2));
  border-radius: 8px;
  padding: 1.25rem;
  min-width: 320px;
  max-width: 440px;
  color: var(--text, #e0e0e0);
  box-shadow: 0 8px 32px rgba(0,0,0,0.5);
  max-height: 80vh;
  overflow-y: auto;
}

.spell-resolve-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  color: var(--accent, #6d9eeb);
}

.spell-resolve-hint {
  font-size: 0.78rem;
  color: var(--text-muted, #888);
  margin-bottom: 0.6rem;
}

.spell-resolve-info {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.6rem;
}

.spell-resolve-info > span {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  white-space: nowrap;
}

.spell-info-save {
  background: rgba(245, 158, 11, 0.15);
  color: var(--yellow-warn, #f59e0b);
  border: 1px solid rgba(245, 158, 11, 0.3);
}

.spell-info-damage {
  background: rgba(239, 68, 68, 0.15);
  color: var(--danger, #ef4444);
  border: 1px solid rgba(239, 68, 68, 0.3);
}

.spell-info-healing {
  background: rgba(34, 197, 94, 0.15);
  color: var(--success, #22c55e);
  border: 1px solid rgba(34, 197, 94, 0.3);
}

.spell-info-half {
  background: rgba(200, 200, 220, 0.08);
  color: var(--text-muted, #aaa);
  border: 1px solid rgba(200, 200, 220, 0.15);
}

.spell-info-conc {
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  border: 1px solid rgba(59, 130, 246, 0.3);
}

.spell-info-cond {
  background: rgba(168, 85, 247, 0.15);
  color: #c084fc;
  border: 1px solid rgba(168, 85, 247, 0.3);
}

/* Target list */
.spell-resolve-targets {
  max-height: 250px;
  overflow-y: auto;
  margin-bottom: 0.6rem;
  border: 1px solid rgba(200, 200, 220, 0.1);
  border-radius: 4px;
}

.spell-target-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.5rem;
  cursor: pointer;
  font-size: 0.82rem;
  border-bottom: 1px solid rgba(200, 200, 220, 0.06);
  transition: background 0.1s;
}

.spell-target-row:hover {
  background: rgba(255, 255, 255, 0.04);
}

.spell-target-row:last-child {
  border-bottom: none;
}

.spell-target-cb {
  width: auto;
  margin: 0;
}

.spell-target-name {
  flex: 1;
  font-weight: 500;
}

.spell-target-name.npc {
  color: var(--danger, #ef4444);
}

.spell-target-ac {
  font-size: 0.72rem;
  color: var(--accent, #6d9eeb);
  font-weight: 600;
}

.spell-target-hp {
  font-size: 0.72rem;
  color: var(--text-muted, #aaa);
}

/* Resolution popup target list (no checkboxes) */
.spell-resolve-target-list {
  margin-bottom: 0.6rem;
}

.spell-resolve-target-head {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted, #aaa);
  margin-bottom: 0.3rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.spell-resolve-target-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.82rem;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 3px;
  margin-bottom: 2px;
}

/* Buttons */
.spell-resolve-buttons {
  display: flex;
  gap: 0.5rem;
  justify-content: flex-end;
  margin-top: 0.5rem;
}

.spell-resolve-btn {
  min-width: 140px;
}

/* ---- Attack resolution pipeline ---- */
.attack-resolve-dialog {
  max-width: 460px;
}

.attack-resolve-default-target {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.3rem;
}

.attack-resolve-label {
  font-size: 0.8rem;
  color: var(--text-muted);
  white-space: nowrap;
}

.attack-resolve-target-select {
  flex: 1;
  font-size: 0.78rem;
  padding: 0.25rem 0.3rem;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.attack-resolve-section-label {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin: 0.3rem 0 0.15rem;
}

.attack-resolve-per-attack {
  margin-bottom: 0.3rem;
}

.attack-resolve-atk-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.15rem 0;
}

.attack-resolve-atk-name {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text);
  min-width: 6rem;
}

.attack-resolve-adv-display {
  font-size: 0.78rem;
  padding: 0.2rem 0.5rem;
  border-radius: var(--radius);
  min-height: 1.2rem;
}

.attack-resolve-adv-display.adv-advantage {
  background: rgba(34, 197, 94, 0.15);
  color: var(--success);
}

.attack-resolve-adv-display.adv-disadvantage {
  background: rgba(239, 68, 68, 0.15);
  color: var(--danger);
}

.attack-resolve-adv-display.adv-normal {
  color: var(--text-muted);
}

.attack-resolve-adv-override {
  display: flex;
  gap: 0.25rem;
  margin: 0.2rem 0;
}

.attack-adv-btn {
  padding: 0.12rem 0.4rem !important;
  font-size: 0.7rem !important;
  flex: 1;
  text-align: center;
}

.attack-adv-btn.active {
  background: var(--accent) !important;
  color: #000 !important;
  border-color: var(--accent) !important;
}

/* Concentration badge in combat card */
.card-conc-spell {
  font-size: 0.7rem;
  color: #60a5fa;
  font-style: italic;
  margin-left: 0.3rem;
}