.skill-tree-page.svelte-kbxf2k{min-height:100vh;display:flex;flex-direction:column;padding:1rem;position:relative}.header.svelte-kbxf2k{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;position:relative;z-index:30}.back-button.svelte-kbxf2k{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary);padding:.5rem 1rem;border-radius:8px;background:var(--bg-secondary);transition:all .3s ease}.back-button.svelte-kbxf2k:hover{background:var(--bg-tertiary);color:var(--accent-blue);transform:translate(-3px)}.page-title.svelte-kbxf2k{font-size:clamp(1.5rem,5vw,2rem);background:linear-gradient(135deg,var(--accent-blue),var(--accent-purple));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.skill-tree-wrapper.svelte-kbxf2k{display:flex;gap:2rem;flex:1;max-height:calc(100vh - 260px);min-height:520px;max-width:1200px;width:100%;margin:0 auto}.encoding-tree-container.svelte-kbxf2k{flex:0 0 20%;min-width:150px;max-width:250px}.main-tree-container.svelte-kbxf2k{flex:1;min-width:250px}.skill-tree-inner.svelte-kbxf2k{position:relative;width:100%;height:100%}.connection-lines.svelte-kbxf2k{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.skill-nodes.svelte-kbxf2k{position:absolute;inset:0;width:100%;height:100%;z-index:26;pointer-events:none}.skill-node.svelte-kbxf2k{position:absolute;transform:translate(-50%,-40px);display:flex;flex-direction:column;align-items:center;transition:all .3s ease;cursor:pointer;pointer-events:auto}.skill-node.svelte-kbxf2k:hover:not(.cannot-learn){transform:translate(-50%,-40px) scale(1.1)}.skill-node.selected.svelte-kbxf2k .node-circle:where(.svelte-kbxf2k){box-shadow:0 0 30px var(--node-color),0 0 60px var(--node-color);transform:scale(1.2)}.node-circle.svelte-kbxf2k{width:55px;height:55px;border-radius:50%;background:var(--bg-secondary);border:3px solid var(--node-color);display:flex;align-items:center;justify-content:center;color:var(--node-color);box-shadow:0 5px 20px #0000004d,0 0 20px var(--node-color);transition:all .3s ease;position:relative}.node-circle.svelte-kbxf2k:before{content:"";position:absolute;inset:-3px;border-radius:50%;background:var(--node-color);opacity:0}.skill-node.can-learn.svelte-kbxf2k .node-circle:where(.svelte-kbxf2k):before{animation:svelte-kbxf2k-pulse-ring 2s ease-out 6 forwards}.skill-node.can-learn.svelte-kbxf2k:hover .node-circle:where(.svelte-kbxf2k):before{animation:svelte-kbxf2k-pulse-ring 1s ease-out infinite}.skill-node.cannot-learn.svelte-kbxf2k .node-circle:where(.svelte-kbxf2k){border-color:var(--border-color);color:var(--border-color);box-shadow:0 5px 15px #0003}.skill-node.learnt.svelte-kbxf2k .node-circle:where(.svelte-kbxf2k){box-shadow:0 5px 20px #0000004d}.node-label.svelte-kbxf2k{font-size:.9rem;font-weight:600;color:var(--text-primary);text-align:center;max-width:120px;text-shadow:0 2px 4px rgba(0,0,0,.5)}.skill-node.cannot-learn.svelte-kbxf2k .node-label:where(.svelte-kbxf2k){color:color-mix(in srgb,var(--text-secondary),60% black);text-shadow:0px 0px 2px rgb(00,00,00)}.panel-backdrop.svelte-kbxf2k{position:fixed;inset:0;background:transparent;z-index:25;cursor:default}.skill-detail-panel.svelte-kbxf2k{position:fixed;bottom:0;left:0;right:0;background:var(--bg-secondary);border-top:2px solid var(--border-color);padding:1.5rem;z-index:30;animation:svelte-kbxf2k-slideUpPanel .3s ease-out;box-shadow:0 -10px 30px #00000080}.panel-content.svelte-kbxf2k{max-width:600px;margin:0 auto}.skill-title.svelte-kbxf2k{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.skill-description.svelte-kbxf2k{color:var(--text-secondary);margin-bottom:1rem;line-height:1.6}.hint-text.svelte-kbxf2k{color:var(--accent-blue);font-style:italic;font-size:.9rem}.start-lesson-button.svelte-kbxf2k{width:100%;padding:1rem;border-radius:12px;color:#fff;font-weight:600;font-size:1.1rem;display:flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:0 5px 20px #0000004d;transition:all .3s ease}.start-lesson-button.svelte-kbxf2k:hover{transform:translateY(-2px);box-shadow:0 8px 30px #0006}@keyframes svelte-kbxf2k-slideUpPanel{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes svelte-kbxf2k-pulse-ring{0%{opacity:.5;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}@media(max-width:768px){.skill-tree-wrapper.svelte-kbxf2k{flex-direction:column;gap:1rem;max-height:none;min-height:auto}.encoding-tree-container.svelte-kbxf2k{flex:0 0 auto;max-width:none;height:200px}.main-tree-container.svelte-kbxf2k{flex:1;min-height:400px}.skill-tree-inner.svelte-kbxf2k{height:100%}.node-circle.svelte-kbxf2k{width:60px;height:60px}.node-circle.svelte-kbxf2k svg:where(.svelte-kbxf2k){width:20px;height:20px}.node-label.svelte-kbxf2k{font-size:.8rem;max-width:100px}.skill-detail-panel.svelte-kbxf2k{padding:1rem}.skill-title.svelte-kbxf2k{font-size:1.25rem}.start-lesson-button.svelte-kbxf2k{font-size:1rem;padding:.875rem}}@media(max-width:480px){.page-title.svelte-kbxf2k{font-size:1.25rem}.back-button.svelte-kbxf2k{padding:.5rem}}
