.skills{width:100vw;height:100dvh;position:relative;overflow:hidden}.skills .skills-title{font-family:var(--font-montserrat),sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff;text-align:center;width:100%;font-size:clamp(1.375rem,2vw,1.75rem);font-weight:400;line-height:1.2;position:absolute;top:5vh;left:0}.skills .skills-hint{font-family:var(--font-inter),sans-serif;color:#9a9a9a;text-align:center;-webkit-user-select:none;user-select:none;width:100%;font-size:.9375rem;font-weight:400;line-height:1.4;position:absolute;bottom:3vh;left:0}.skills .skills-list{display:none}
@media screen and (max-width:600px) and (max-height:1000px) and (orientation:portrait){.skills{height:auto;min-height:100dvh;padding:12vh 24px 10vh;overflow-y:auto}.skills .skills-title{position:static}.skills .skills-hint{display:none}.skills .skills-list{max-width:640px;margin:6vh auto 0;display:block}.skills .skills-list .list-branch+.list-branch{margin-top:5vh}.skills .skills-list .list-branch .branch-name{font-family:var(--font-montserrat),sans-serif;letter-spacing:.15em;text-transform:uppercase;color:#fff;font-size:1.25rem;font-style:italic;font-weight:400}.skills .skills-list .list-branch .branch-group{margin-top:20px}.skills .skills-list .list-branch .branch-group .group-name{font-family:var(--font-inter),sans-serif;color:#fff;font-size:1rem;font-weight:600}.skills .skills-list .list-branch .branch-group .group-items{font-family:var(--font-inter),sans-serif;color:#9a9a9a;margin-top:6px;font-size:.9375rem;font-weight:400;line-height:1.7}.skills .skills-list .list-branch .branch-item{font-family:var(--font-inter),sans-serif;color:#cfcfcf;margin-top:12px;font-size:.9375rem;font-weight:400;line-height:1.4}}@media (prefers-reduced-motion:reduce){.skills{height:auto;min-height:100dvh;padding:12vh 24px 10vh;overflow-y:auto}.skills .skills-title{position:static}.skills .skills-hint{display:none}.skills .skills-list{max-width:640px;margin:6vh auto 0;display:block}.skills .skills-list .list-branch+.list-branch{margin-top:5vh}.skills .skills-list .list-branch .branch-name{font-family:var(--font-montserrat),sans-serif;letter-spacing:.15em;text-transform:uppercase;color:#fff;font-size:1.25rem;font-style:italic;font-weight:400}.skills .skills-list .list-branch .branch-group{margin-top:20px}.skills .skills-list .list-branch .branch-group .group-name{font-family:var(--font-inter),sans-serif;color:#fff;font-size:1rem;font-weight:600}.skills .skills-list .list-branch .branch-group .group-items{font-family:var(--font-inter),sans-serif;color:#9a9a9a;margin-top:6px;font-size:.9375rem;font-weight:400;line-height:1.7}.skills .skills-list .list-branch .branch-item{font-family:var(--font-inter),sans-serif;color:#cfcfcf;margin-top:12px;font-size:.9375rem;font-weight:400;line-height:1.4}}@media screen and (max-width:1000px) and (max-height:600px) and (orientation:landscape){.skills .skills-title{font-size:1.125rem;top:4vh}.skills .skills-hint{font-size:.75rem;bottom:2vh}}
.skills-graph{cursor:grab;touch-action:none;width:100%;height:100%;position:absolute;inset:0}.skills-graph:active{cursor:grabbing}.skills-graph .graph-link{stroke:#ffffff38;stroke-width:1px;transition:opacity .3s}.skills-graph .graph-link.dimmed{opacity:.25}.skills-graph .graph-link.active{stroke:#ffffff8c}.skills-graph .graph-node{cursor:grab;transition:opacity .3s}.skills-graph .graph-node:active{cursor:grabbing}.skills-graph .graph-node.dimmed{opacity:.2}.skills-graph .graph-node .node-dot{fill:#fff}.skills-graph .graph-node .node-label{fill:#cfcfcf;font-family:var(--font-inter),sans-serif;text-anchor:middle;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:13px}.skills-graph .graph-node.depth-0 .node-label{fill:#fff;font-family:var(--font-montserrat),sans-serif;letter-spacing:.08em;text-transform:uppercase;font-size:26px;font-weight:700}.skills-graph .graph-node.depth-1 .node-label{fill:#fff;font-family:var(--font-montserrat),sans-serif;letter-spacing:.06em;text-transform:uppercase;font-size:17px;font-weight:700}.skills-graph .graph-node.depth-2 .node-label{fill:#fff;font-size:14px;font-weight:600}
@media screen and (max-width:600px) and (max-height:1000px) and (orientation:portrait){.skills-graph{display:none}}@media (prefers-reduced-motion:reduce){.skills-graph{display:none}}