/* CSS Cog: skills.css */
/* Cost buttons on skills/spells */
.cost-btn{display:inline-flex;align-items:center;gap:0.2em;padding:0.15em 0.4em;border-radius:4px;background:rgba(88,101,242,0.15);border:1px solid rgba(88,101,242,0.3);color:var(--accent-blue);font-size:0.7em;font-family:var(--font-code);cursor:pointer;transition:all 0.15s;margin-right:0.3em;}
.cost-btn:hover{background:rgba(88,101,242,0.3);}
.cost-btn.cost-hp{background:rgba(237,66,69,0.15);border-color:rgba(237,66,69,0.3);color:var(--accent-red);}
.cost-btn.cost-hp:hover{background:rgba(237,66,69,0.3);}


.roll-icon{cursor:pointer;color:var(--accent-amber);transition:color 0.15s;font-size:0.9em;}.roll-icon:hover{color:var(--accent-cyan);}
.skill-action-btn{cursor:pointer;font-size:0.6em;padding:0.15em 0.4em;border-radius:3px;font-weight:700;transition:all 0.15s;display:inline-flex;align-items:center;gap:0.2em;vertical-align:middle;}
.skill-heal-btn{color:var(--accent-green);background:rgba(87,242,135,0.1);border:1px solid rgba(87,242,135,0.25);}.skill-heal-btn:hover{background:rgba(87,242,135,0.2);border-color:rgba(87,242,135,0.5);}
.skill-mp-btn{color:var(--accent-blue);background:rgba(88,101,242,0.1);border:1px solid rgba(88,101,242,0.25);}.skill-mp-btn:hover{background:rgba(88,101,242,0.2);border-color:rgba(88,101,242,0.5);}
.skill-ip-btn{color:var(--accent-cyan);background:rgba(0,188,212,0.1);border:1px solid rgba(0,188,212,0.25);}.skill-ip-btn:hover{background:rgba(0,188,212,0.2);border-color:rgba(0,188,212,0.5);}
.skill-info-tag{cursor:help;color:var(--accent-amber);font-size:0.85em;opacity:0.6;transition:opacity 0.15s;}.skill-info-tag:hover{opacity:1;}

/* Spell cast button */
.spell-cast-btn{background:rgba(136,102,242,0.15)!important;border-color:rgba(136,102,242,0.35)!important;color:#a388f2!important;gap:0.3em;}
.spell-cast-btn:hover{background:rgba(136,102,242,0.3)!important;color:#c4b0ff!important;}

/* Spell formula line inside collapse body */
.spell-formula{font-family:var(--font-code);font-size:0.8em;color:var(--accent-amber);padding:0.3em 0;margin-bottom:0.4em;border-bottom:1px solid rgba(63,65,71,0.4);}

/* ============================================================
   QUIRKS
   ============================================================ */
.quirk-panel{border-left:3px solid var(--accent-amber);}
.quirk-tags{display:flex;flex-wrap:wrap;gap:0.3em;margin:0.5em 0;}
.quirk-tag{font-size:0.65em;padding:0.2em 0.5em;border-radius:3px;background:rgba(240,178,50,0.1);border:1px solid rgba(240,178,50,0.25);color:var(--accent-amber);font-weight:700;font-family:var(--font-display);letter-spacing:0.04em;}
.quirk-flavor{font-size:0.85em;color:var(--text-secondary);margin:0.4em 0;padding:0.3em 0.5em;background:var(--bg-darkest);border-radius:var(--radius-sm);border-left:2px solid var(--border-thin);}
.quirk-counter{font-family:var(--font-code);color:var(--accent-red);font-weight:700;}
.quirk-actions{margin-top:0.5em;}
.btn-quirk-action{background:rgba(240,178,50,0.1);border:1px solid rgba(240,178,50,0.3);color:var(--accent-amber);font-size:0.7em;padding:0.3em 0.7em;border-radius:var(--radius-sm);cursor:pointer;font-weight:700;font-family:var(--font-display);transition:all 0.15s;}.btn-quirk-action:hover{background:rgba(240,178,50,0.2);border-color:var(--accent-amber);}
.quirk-spell{margin:0.5em 0;padding:0.4em 0.6em;background:var(--bg-darkest);border-radius:var(--radius-sm);border:1px solid var(--border-thin);}
.quirk-spell-name{font-weight:700;color:var(--text-primary);}
.quirk-spell-cost{font-family:var(--font-code);color:var(--accent-blue);font-size:0.85em;}
.quirk-spell-text{font-size:0.85em;color:var(--text-secondary);margin-top:0.2em;}
.quirk-enabled-badge{display:inline-flex;align-items:center;gap:0.3em;padding:0.3em 0.7em;border-radius:var(--radius-sm);background:rgba(240,178,50,0.1);border:1px solid rgba(240,178,50,0.3);color:var(--accent-amber);font-size:0.8em;font-weight:700;}

/* ============================================================
   HEROIC SKILLS
   ============================================================ */
.heroic-star{color:var(--accent-amber);margin-right:0.3em;font-size:0.85em;}




/* ============================================================
   v2.1.0 - Class Picks subsection (Dance, Symbolism, Magichant,
   Bind and Summon, Quirk, Akromorphosis). Renders inside the
   skill's collapse body, below the description.
   ============================================================ */
.skill-picks-block {
  margin-top: 0.6em;
  padding-top: 0.5em;
  border-top: 1px solid var(--border-thin);
}
.skill-picks-label {
  font-family: var(--font-display);
  font-size: 0.7em;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-amber);
  margin-bottom: 0.4em;
}
.skill-pick-row {
  background: var(--bg-darkest);
  border: 1px solid var(--border-thin);
  border-left: 3px solid var(--accent-abyssal);
  border-radius: var(--radius-sm);
  padding: 0.5em 0.7em;
  margin-bottom: 0.35em;
}
.skill-pick-row:last-child {
  margin-bottom: 0;
}
.skill-pick-name {
  font-weight: 700;
  color: var(--text-primary);
  font-size: 0.92em;
}
.skill-pick-tags {
  margin-top: 0.25em;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em;
}
.skill-pick-tag {
  font-family: var(--font-display);
  font-size: 0.65em;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.1em 0.4em;
  border-radius: 3px;
  background: rgba(110,95,168,0.15);
  border: 1px solid rgba(110,95,168,0.35);
  color: var(--accent-abyssal);
}
.skill-pick-tag-homebrew {
  background: rgba(240,178,50,0.15);
  border-color: rgba(240,178,50,0.35);
  color: var(--accent-amber);
}
.skill-pick-desc {
  margin-top: 0.35em;
  font-size: 0.85em;
  color: var(--text-secondary);
  line-height: 1.5;
}
.skill-pick-empty {
  padding: 0.5em 0.7em;
  background: var(--bg-darkest);
  border: 1px dashed var(--border-thin);
  border-radius: var(--radius-sm);
  font-size: 0.82em;
  color: var(--text-muted);
  font-style: italic;
}