/* === Skill Bars (inline) === */
.skills-bars{ display:grid; gap:1rem; grid-template-columns: repeat(2, minmax(0,1fr)); }
.skill-group{ border:1px solid var(--line, #1f2633); background: rgba(255,255,255,0.03); border-radius:14px; padding:1rem; }
.skill{ margin:.6rem 0; }
.skill .head{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; font-size:.95rem; }
.skill .label{ color:var(--text, #e8eef7); font-weight:600; }
.skill .val{ color:var(--muted, #9fb0c3); font-variant-numeric: tabular-nums; min-width:3ch; text-align:right; }
.skill .bar{ position:relative; height:10px; border-radius:999px; overflow:hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid var(--line, #1f2633);
  margin-top:.4rem;
}
.skill .bar > span{
  display:block; height:100%; width:0;
  background: linear-gradient(90deg, #7bd6ff, #9effa9);
  border-right: 1px solid rgba(0,0,0,.2);
  animation: fillbar 1.1s ease-out forwards;
  max-width:100%;
}
@keyframes fillbar { to { width: var(--val, 0%); } }
@media (max-width: 900px){ .skills-bars{ grid-template-columns: 1fr; } }