/* ═══ Färdighetsträd ═══ */
.sk-wrap{max-width:1100px;margin:0 auto;padding:18px 14px 60px;color:#eee}
.sk-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;padding:24px;border-radius:18px;margin-bottom:16px;
  background:radial-gradient(circle at 10% 10%,rgba(255,90,60,.22),transparent 50%),radial-gradient(circle at 50% 100%,rgba(77,160,255,.2),transparent 55%),radial-gradient(circle at 90% 20%,rgba(80,220,120,.2),transparent 50%),#111117;
  border:1px solid rgba(255,255,255,.08)}
.sk-kicker{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#9fe0a8;font-weight:800}
.sk-title{font-size:clamp(34px,6vw,54px);margin:4px 0;font-weight:900}.sk-sub{margin:0;color:#bbb;max-width:560px}
.sk-points{display:flex;flex-direction:column;align-items:center;padding:12px 20px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);min-width:150px}
.sk-points b{font-size:44px;line-height:1;color:#f5c842}.sk-points small{text-transform:uppercase;font-size:11px;color:#aaa;letter-spacing:.1em}.sk-points span{font-size:12px;color:#888;margin-top:4px}
.sk-points.glow{box-shadow:0 0 0 2px #f5c842,0 0 30px rgba(245,200,66,.35);animation:skGlow 1.6s infinite}
@keyframes skGlow{50%{box-shadow:0 0 0 2px #f5c842,0 0 10px rgba(245,200,66,.2)}}
.sk-toast{padding:11px 15px;border-radius:12px;margin-bottom:14px;font-weight:700}.sk-toast.ok{background:rgba(70,200,110,.15);color:#9ff0b5}.sk-toast.bad{background:rgba(230,70,70,.15);color:#ffb3b3}
.sk-branches{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.sk-branches{grid-template-columns:1fr}}
.sk-branch{--bc:#ff6a4d;border-radius:16px;padding:16px;background:linear-gradient(180deg,color-mix(in srgb,var(--bc) 14%,#121218),#101015 60%);border:1px solid color-mix(in srgb,var(--bc) 35%,transparent)}
.sk-branch.b-smart{--bc:#4da3ff}.sk-branch.b-rich{--bc:#4fdc7c}
.sk-branch h2{margin:0;font-size:22px;color:var(--bc);display:flex;justify-content:space-between;align-items:baseline}.sk-branch h2 small{color:#999;font-size:13px}
.sk-bdesc{color:#aaa;font-size:13px;margin:4px 0 12px}
.sk-nodes{display:flex;flex-direction:column;gap:0;position:relative}
.sk-node{position:relative;display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:#17171f;border:1px solid #262630;margin-bottom:14px;transition:transform .15s,border-color .2s}
.sk-node:not(:last-child)::after{content:"";position:absolute;left:28px;bottom:-15px;width:3px;height:14px;background:#2a2a35}
.sk-node.has{border-color:color-mix(in srgb,var(--bc) 60%,transparent)}.sk-node.has:not(:last-child)::after{background:var(--bc)}
.sk-node.max{background:linear-gradient(90deg,color-mix(in srgb,var(--bc) 18%,#17171f),#17171f)}
.sk-node.locked{opacity:.45;filter:grayscale(.6)}
.sk-node.cap{border-style:dashed;border-width:2px}.sk-node.cap.has{border-style:solid;box-shadow:0 0 22px color-mix(in srgb,var(--bc) 40%,transparent)}
.sk-ic{width:38px;height:38px;flex:none;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;background:#0e0e13}
.sk-nt{flex:1;min-width:0}.sk-nt b{display:block;font-size:14px}.sk-nt small{display:block;color:#aaa;font-size:12px;line-height:1.35}
.sk-pips{display:flex;gap:4px;margin-top:5px;align-items:center}.sk-pips i{width:16px;height:6px;border-radius:3px;background:#2d2d38;display:block}.sk-pips i.on{background:var(--bc);box-shadow:0 0 6px var(--bc)}
.sk-pips em{font-style:normal;font-size:11px;color:#f5c842;margin-left:4px}
.sk-plus{width:36px;height:36px;flex:none;border-radius:50%;border:0;font-size:22px;font-weight:900;cursor:pointer;color:#111;background:var(--bc);transition:transform .1s}
.sk-plus:active:not(:disabled){transform:scale(.9)}.sk-plus:disabled{background:#2a2a33;color:#555;cursor:not-allowed}
.sk-respec{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding:16px;border-radius:14px;background:#121218;border:1px solid rgba(255,255,255,.07)}
.sk-respec h3{margin:0 0 4px}.sk-respec p{margin:0;color:#aaa;font-size:13px}
.sk-btn{border:0;border-radius:10px;padding:10px 16px;font-weight:800;cursor:pointer}.sk-btn.ghost{background:transparent;border:1px solid #444;color:#ddd}.sk-btn.danger{background:#d9443a;color:#fff}.sk-btn:disabled{opacity:.4;cursor:not-allowed}
.sk-wipe{color:#777;font-size:12px;text-align:center;margin-top:12px}
