.skill-tree-card{position:relative}.skill-tree-toolbar{justify-content:flex-end;display:flex}.skill-tree-expand-button,.skill-tree-close-button{border:1px solid var(--line-color);background:var(--btn-regular-bg);color:#000000b8;border-radius:9999px;justify-content:center;align-items:center;width:2.4rem;height:2.4rem;transition:transform .2s,background .2s,color .2s;display:inline-flex}.skill-tree-expand-button:hover,.skill-tree-close-button:hover{background:var(--btn-regular-bg-hover);color:var(--primary);transform:translateY(-1px)}.skill-tree-shell{width:min(100%,27rem);margin:0 auto}.skill-tree-shell.preview{width:min(100%,20rem)}.skill-tree-shell.full{width:min(100%,54rem)}.skill-tree-canvas{aspect-ratio:1;background:var(--card-bg);border:1px solid #94a3b82e;border-radius:1.1rem;width:100%;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff73}.skill-tree-grid{pointer-events:none;background-image:linear-gradient(#94a3b80f 1px,#0000 1px),linear-gradient(90deg,#94a3b80f 1px,#0000 1px);background-size:1.15rem 1.15rem;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#000 68%,#0000 100%);mask-image:radial-gradient(circle,#000 68%,#0000 100%)}.skill-tree-shell.preview .skill-tree-grid{display:none}.skill-tree-shell.preview .skill-tree-canvas{box-shadow:none;border:none;outline:none;transform:translateY(-2.5rem)}.skill-tree-shell.preview{margin-bottom:-3rem}.skill-tree-ring{width:var(--ring-size);height:var(--ring-size);pointer-events:none;border:1px dashed #94a3b82e;border-radius:9999px;position:absolute;inset:50%;transform:translate(-50%,-50%)}.skill-tree-svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.skill-tree-link{stroke:#94a3b84d;stroke-width:.9px;stroke-linecap:round}.skill-tree-node{left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);width:var(--size);height:var(--size);z-index:2;border:2px solid var(--node-color);box-shadow:0 0 0 4px color-mix(in oklab, var(--node-color) 14%, transparent), 0 10px 24px #0f172a1f;background:radial-gradient(circle at 30% 30%,#fffffff5,#f1f5f9db);border-radius:9999px;transition:transform .2s,box-shadow .2s;position:absolute;overflow:visible;transform:translate(-50%,-50%)}.skill-tree-node:hover{z-index:4;box-shadow:0 0 0 5px color-mix(in oklab, var(--node-color) 20%, transparent), 0 14px 30px #0f172a29;transform:translate(-50%,-50%)scale(1.06)}.skill-tree-node:after{content:attr(data-name);color:#0f172ad6;white-space:nowrap;opacity:0;pointer-events:none;background:#fffffff5;border:1px solid #94a3b833;border-radius:9999px;padding:.32rem .6rem;font-size:.72rem;font-weight:500;line-height:1;transition:opacity .18s,transform .18s;position:absolute;bottom:calc(100% + .55rem);left:50%;transform:translate(-50%)translateY(.3rem);box-shadow:0 10px 24px #0f172a1f}.skill-tree-node:hover:after,.skill-tree-node:focus-within:after{opacity:1;transform:translate(-50%)translateY(0)}.skill-tree-node.preview.depth-0{--size:4.45rem}.skill-tree-node.preview.depth-1{--size:3.65rem}.skill-tree-node.full.depth-0{--size:5rem}.skill-tree-node.full.depth-1{--size:4.2rem}.skill-tree-node.full.depth-2{--size:3.25rem}.skill-tree-node.full.depth-3{--size:2.7rem}.skill-tree-node.full.depth-4{--size:2.1rem}.skill-tree-node-button{background:0 0;border:0;border-radius:9999px;justify-content:center;align-items:center;width:100%;height:100%;padding:.4rem;display:flex;overflow:hidden}.skill-tree-node-icon{-o-object-fit:cover;object-fit:cover;border-radius:9999px;width:100%;height:100%;display:block}.skill-tree-node-empty{border:1px dashed color-mix(in oklab, var(--node-color) 60%, transparent);background:color-mix(in oklab, var(--node-color) 10%, transparent);border-radius:9999px;width:42%;height:42%}.skill-tree-dialog{background:0 0;border:0;width:min(92vw,70rem);max-width:70rem;max-height:92vh;padding:0}.skill-tree-dialog::backdrop{backdrop-filter:blur(10px);background:#0f172a9e}.skill-tree-dialog-panel{background:var(--card-bg);border:1px solid var(--line-color);border-radius:1.5rem;flex-direction:column;max-height:92vh;display:flex;overflow:hidden;box-shadow:0 28px 80px #0f172a3d}.skill-tree-dialog-header{justify-content:space-between;align-items:center;gap:1rem;padding:1.15rem 1.2rem .9rem;display:flex}.skill-tree-dialog-title{color:#000000d1;margin:0;font-size:1.05rem;font-weight:600}.skill-tree-dialog-subtitle{color:#0000008c;margin:.25rem 0 0;font-size:.92rem}.skill-tree-dialog-body{flex:1;min-height:0;padding:0 1.2rem 1.2rem}.skill-tree-dialog-body .skill-tree-shell.full{width:min(100%,92vh - 7.5rem)}:root.dark .skill-tree-expand-button,:root.dark .skill-tree-close-button{color:#ffffffc7}:root.dark .skill-tree-canvas{box-shadow:inset 0 1px #ffffff0a}:root.dark .skill-tree-node{box-shadow:0 0 0 4px color-mix(in oklab, var(--node-color) 14%, transparent), 0 10px 24px #02061742;background:radial-gradient(circle at 30% 30%,#334155fa,#0f172af5)}:root.dark .skill-tree-node:hover{box-shadow:0 0 0 5px color-mix(in oklab, var(--node-color) 20%, transparent), 0 14px 30px #02061752}:root.dark .skill-tree-node:after{color:#ffffffe0;background:#0f172af5;border-color:#94a3b83d;box-shadow:0 12px 28px #02061747}:root.dark .skill-tree-dialog-title{color:#ffffffe6}:root.dark .skill-tree-dialog-subtitle{color:#fff9}@media (width<=768px){.skill-tree-shell,.skill-tree-shell.full{width:100%}.skill-tree-node.preview.depth-0{--size:3.9rem}.skill-tree-node.preview.depth-1{--size:3rem}.skill-tree-node.full.depth-0{--size:4.2rem}.skill-tree-node.full.depth-1{--size:3.55rem}.skill-tree-node.full.depth-2{--size:2.75rem}.skill-tree-node.full.depth-3{--size:2.3rem}.skill-tree-node.full.depth-4{--size:1.95rem}}
