#skill-tree-screen{position:absolute;inset:0;z-index:15;display:flex;flex-direction:column;align-items:stretch;pointer-events:auto;overflow-x:hidden;overflow-y:auto;color:#fff;font-family:Orbitron,sans-serif}#skill-tree-screen.hidden{display:none!important}.skill-tree-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(0,255,255,.08),transparent 60%),radial-gradient(ellipse 60% 40% at 20% 80%,rgba(255,0,255,.06),transparent 50%),radial-gradient(ellipse 60% 40% at 80% 70%,rgba(255,100,0,.05),transparent 50%),linear-gradient(180deg,#050510,#0a0a1a,#050510);z-index:0}.skill-tree-bg:before{content:"";position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20% 30%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 60% 70%,rgba(255,255,255,.3),transparent),radial-gradient(1px 1px at 80% 20%,rgba(0,255,255,.5),transparent),radial-gradient(1px 1px at 40% 90%,rgba(255,0,255,.4),transparent);background-size:200px 200px;animation:skillStarsDrift 60s linear infinite;opacity:.5}@keyframes skillStarsDrift{0%{transform:translateY(0)}to{transform:translateY(-200px)}}.skill-tree-panel{position:relative;z-index:1;display:flex;flex-direction:column;height:100%;max-width:1400px;margin:0 auto;width:100%;padding:24px 28px 20px}.skill-tree-header{flex-shrink:0;text-align:center;margin-bottom:20px}.skill-tree-header h1{font-size:clamp(1.6rem,4vw,2.4rem);font-weight:900;letter-spacing:.2em;background:linear-gradient(90deg,#0ff,#f0f,#ff0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 20px rgba(0,255,255,.4));margin-bottom:6px}.skill-tree-subtitle{font-size:.75rem;color:#888;letter-spacing:.15em;text-transform:uppercase}.skill-tree-stats{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px 32px;margin-top:18px}.skill-tree-level{font-size:.85rem;color:#0ff;letter-spacing:.12em;text-shadow:0 0 12px rgba(0,255,255,.5)}.skill-tree-xp-wrap{flex:1;min-width:220px;max-width:420px}.skill-tree-xp-text{font-size:.7rem;color:#aaa;margin-bottom:6px;letter-spacing:.05em}.skill-tree-xp-bar{height:12px;background:#ffffff14;border-radius:6px;border:1px solid rgba(0,255,255,.25);overflow:hidden;box-shadow:inset 0 0 8px #00000080}.skill-tree-xp-fill{height:100%;width:0%;background:linear-gradient(90deg,#08f,#0ff,#8ff);border-radius:5px;transition:width .45s cubic-bezier(.22,1,.36,1);box-shadow:0 0 16px #0ff9}.skill-tree-points-badge{display:flex;flex-direction:column;align-items:center;padding:10px 20px;background:#00ffff14;border:2px solid rgba(0,255,255,.4);border-radius:12px;box-shadow:0 0 24px #00ffff26}.skill-tree-points-badge .label{font-size:.6rem;color:#888;letter-spacing:.2em;text-transform:uppercase}.skill-tree-points-badge .value{font-size:2rem;font-weight:900;color:#0ff;line-height:1.1;text-shadow:0 0 20px rgba(0,255,255,.7)}.skill-tree-meta{font-size:.65rem;color:#666;letter-spacing:.1em}.skill-tree-branches{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;min-height:0;overflow-y:auto;overflow-x:hidden;padding:8px 4px 16px;-webkit-overflow-scrolling:touch}@media(max-width:900px){.skill-tree-branches{grid-template-columns:1fr;max-width:400px;margin:0 auto;width:100%}}.skill-branch{--branch-color: #00ffff;--branch-glow: rgba(0, 255, 255, .3);display:flex;flex-direction:column;background:#00000059;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:16px 14px 20px;position:relative;overflow:hidden}.skill-branch:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--branch-color),transparent);opacity:.9}.skill-branch-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.06)}.skill-branch-icon{width:10px;height:10px;border-radius:50%;background:var(--branch-color);box-shadow:0 0 12px var(--branch-color)}.skill-branch-title{font-size:.95rem;font-weight:700;letter-spacing:.2em;color:var(--branch-color);text-shadow:0 0 12px var(--branch-glow);margin:0}.skill-branch-track{display:flex;flex-direction:column;gap:0}.skill-connector{width:2px;height:14px;margin:0 auto;background:linear-gradient(180deg,var(--branch-color),transparent);opacity:.5}.skill-node{position:relative}.skill-node-inner{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:14px;transition:transform .2s,border-color .2s,box-shadow .2s}.skill-node--locked .skill-node-inner{opacity:.85}.skill-node--unlocked .skill-node-inner{border-color:color-mix(in srgb,var(--branch-color) 50%,transparent);box-shadow:0 0 20px var(--branch-glow)}.skill-node--maxed .skill-node-inner{border-color:gold;box-shadow:0 0 18px #ffd70040}.skill-node-inner:hover{transform:translateY(-2px);border-color:#ffffff40}.skill-node-top{display:flex;gap:12px;margin-bottom:10px}.skill-node-icon{font-size:1.6rem;line-height:1;filter:drop-shadow(0 0 8px var(--branch-glow));flex-shrink:0}.skill-node-name{font-size:.85rem;font-weight:700;color:#fff;margin:0 0 4px;letter-spacing:.05em}.skill-node-desc{font-size:.68rem;color:#999;line-height:1.4;margin:0}.skill-pips{display:flex;gap:5px;margin-bottom:12px}.skill-pip{flex:1;height:4px;border-radius:2px;background:#ffffff1f;transition:background .25s,box-shadow .25s}.skill-pip--on{background:var(--branch-color);box-shadow:0 0 8px var(--branch-glow)}.skill-node-footer{display:flex;justify-content:space-between;align-items:center;gap:8px}.skill-level-label{font-size:.65rem;color:#777;letter-spacing:.08em}.skill-node--maxed .skill-level-label{color:gold}.skill-btn{font-family:Orbitron,sans-serif;font-size:.65rem;font-weight:700;letter-spacing:.06em;padding:8px 14px;border-radius:6px;border:1px solid var(--branch-color);background:#0006;color:var(--branch-color);cursor:pointer;transition:background .2s,box-shadow .2s,transform .15s;white-space:nowrap}.skill-btn:hover:not(:disabled){background:var(--branch-glow);box-shadow:0 0 14px var(--branch-glow);transform:scale(1.03)}.skill-btn:disabled{border-color:#444;color:#555;cursor:not-allowed;opacity:.7}.skill-tree-footer{flex-shrink:0;display:flex;justify-content:center;padding-top:12px}.skill-tree-footer .btn{min-width:160px}#hud-xp-container{position:absolute;bottom:72px;left:50%;transform:translate(-50%);width:min(280px,70vw);pointer-events:none;z-index:5;text-align:center}#hud-xp-container.hidden{display:none}.hud-xp-label{font-size:.55rem;color:#0ffc;letter-spacing:.15em;margin-bottom:4px}.hud-xp-bar{height:6px;background:#00000080;border:1px solid rgba(0,255,255,.2);border-radius:3px;overflow:hidden}.hud-xp-fill{height:100%;width:0%;background:linear-gradient(90deg,#06a,#0ff);transition:width .35s ease-out}#level-up-toast{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);z-index:25;padding:24px 40px;background:#050514eb;border:2px solid #00ffff;border-radius:12px;text-align:center;pointer-events:none;opacity:0;transition:opacity .35s,transform .35s;box-shadow:0 0 40px #00ffff4d}#level-up-toast.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}#level-up-toast h2{font-size:1.4rem;color:#0ff;letter-spacing:.2em;margin:0 0 8px;text-shadow:0 0 20px rgba(0,255,255,.8)}#level-up-toast p{font-size:.8rem;color:#aaa;margin:0}#level-up-toast .toast-points{color:#f0f;font-weight:700;margin-top:8px}.crit-flash{animation:critPulse .15s ease-out}@keyframes critPulse{0%{filter:brightness(2) saturate(1.5)}to{filter:none}}
