/* ── SKILL TREE SECTION — open sections, no boxes ── */
.sec{margin-bottom:var(--sp-6)}
.sec-lbl{
  font-size:10px;color:var(--tm);
  margin-bottom:var(--sp-5);
  display:flex;align-items:center;gap:12px;
}
.sec-lbl::after{content:'';flex:1;height:1px;background:var(--bd)}

/* ── SKILL GRID ── */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4) var(--sp-3)}
.grid.g5{grid-template-columns:repeat(5,1fr)}
@media (min-width:768px){
  .grid{grid-template-columns:repeat(5,1fr)}
  .grid.g5{grid-template-columns:repeat(6,1fr)}
}

/* ── SKILL NODE — medallion circles ── */
.snode{
  cursor:pointer;width:100%;
  display:flex;flex-direction:column;align-items:center;gap:9px;
  padding:var(--sp-1) 0;
  transition:opacity var(--dur-fast) var(--ease-out);
}
.icon-box{
  width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  position:relative;
  transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out);
}
.snode:hover .icon-box{transform:translateY(-2px)}
.snode:active .icon-box{transform:scale(0.95)}
.icon-box iconify-icon{font-size:23px;position:relative}

.ib-on{background:var(--tl-l);box-shadow:inset 0 0 0 1px rgba(62,107,92,0.35)}
.ib-on iconify-icon{color:var(--tl-d)}
.ib-meta{background:var(--pu-l);box-shadow:inset 0 0 0 1px rgba(111,91,144,0.35)}
.ib-meta iconify-icon{color:var(--pu-d)}
.ib-act{background:var(--am-l);box-shadow:inset 0 0 0 1px rgba(154,106,11,0.35)}
.ib-act iconify-icon{color:var(--am-d)}
.ib-lock{background:transparent;box-shadow:inset 0 0 0 1px var(--bd2);opacity:0.55}
.ib-lock iconify-icon{color:var(--gray)}

.lv-chip{
  position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);
  font-family:var(--font-body);
  font-size:8px;font-weight:600;letter-spacing:0.04em;
  padding:2px 7px;border-radius:8px;
  border:2px solid var(--bg);white-space:nowrap;z-index:1;
}
.ib-on   .lv-chip{background:var(--teal);color:#fff}
.ib-meta .lv-chip{background:var(--purple);color:#fff}
.ib-act  .lv-chip{background:var(--amber);color:#fff}
.ib-lock .lv-chip{background:var(--s2);color:var(--gr-d)}

.pdots{display:flex;gap:3px;margin-top:5px}
.pd{width:4px;height:4px;border-radius:50%;background:var(--s2)}
.pd.tl{background:var(--teal)}
.pd.am{background:var(--amber)}.pd.pu{background:var(--purple)}
.sname{font-size:10px;font-weight:500;color:var(--ts);text-align:center;line-height:1.3;max-width:72px}
.sname.bold{color:var(--tp);font-weight:600}
.lock-tag{position:absolute;top:2px;right:2px;z-index:2;opacity:0.6}
.lock-tag iconify-icon{font-size:10px;color:var(--gr-d)}