.ys-skills{position:relative;overflow:hidden;padding-top:7rem;padding-bottom:7rem;background-color:color-mix(in srgb,var(--muted) 10%,transparent)}@media (min-width:1024px){.ys-skills{padding-top:9rem;padding-bottom:9rem}}.ys-skills__topline{position:absolute;top:0;left:0;width:100%;height:1px;background-image:linear-gradient(to right,transparent,var(--border),transparent);pointer-events:none}.ys-skills__blob-1{position:absolute;top:-5rem;left:25%;width:16rem;height:16rem;border-radius:var(--radius-full);background-color:color-mix(in srgb,var(--primary) 5%,transparent);filter:blur(64px);pointer-events:none}.ys-skills__blob-2{position:absolute;bottom:5rem;right:25%;width:12rem;height:12rem;border-radius:var(--radius-full);background-color:color-mix(in srgb,var(--primary) 8%,transparent);filter:blur(64px);pointer-events:none}.ys-skills__inner{position:relative;z-index:10;width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad)}.ys-skills__header{text-align:center;max-width:var(--content-max);margin:0 auto 4rem}.ys-skills__header .section-title{margin-bottom:1.5rem}.ys-skills__tabs{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;gap:.5rem;width:100%;margin-bottom:3.5rem;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:.125rem}.ys-skills__tabs::-webkit-scrollbar{display:none}@media (min-width:640px){.ys-skills__tabs{gap:.75rem}}@media (min-width:768px){.ys-skills__tabs{flex-wrap:wrap;justify-content:center;overflow-x:visible}}.ys-skills-tab{display:flex;align-items:center;flex-shrink:0;scroll-snap-align:start;column-gap:.5rem;padding:.625rem 1rem;background-color:var(--surface-60);background-image:linear-gradient(135deg,var(--white-08) 0%,var(--white-02) 100%);border:1px solid var(--border-50);border-radius:var(--radius-s);font-size:var(--text-s);font-weight:500;color:var(--text-muted);line-height:1.25rem;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);transition:color 0.3s,border-color 0.3s,background-color 0.3s,box-shadow 0.3s;cursor:pointer}.ys-skills-tab>span{display:flex;align-items:center}.ys-skills-tab:hover{border-color:color-mix(in srgb,var(--primary) 40%,transparent);color:var(--text)}.ys-skills-tab svg{width:1rem;height:1rem;flex-shrink:0}.ys-skills-tab--active{background-color:var(--primary);background-image:none;border-color:var(--primary);color:var(--primary-fg);box-shadow:0 10px 15px -3px var(--primary-20),0 4px 6px -4px var(--primary-20)}.ys-skills-tab--active:hover{border-color:var(--primary);color:var(--primary-fg)}.ys-skills-tab--active .ys-skills-tab__count{background-color:color-mix(in srgb,var(--primary-fg) 20%,transparent);color:var(--primary-fg)}@media (min-width:640px){.ys-skills-tab{padding:.75rem 1.25rem;font-size:var(--text-m);line-height:1.5rem}.ys-skills-tab svg{width:1.25rem;height:1.25rem}}.ys-skills-tab__count{padding:.125rem .375rem;border-radius:var(--radius-full);background-color:var(--muted);font-size:var(--text-xs);color:var(--text-muted);line-height:1rem;transition:background-color 0.3s,color 0.3s}.ys-skills__panels{width:100%;max-width:var(--content-max-l);margin-inline:auto}.ys-skills__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}@media (min-width:640px){.ys-skills__grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}}@media (min-width:768px){.ys-skills__grid{grid-template-columns:repeat(7,minmax(0,1fr))}}@media (min-width:1024px){.ys-skills__grid{grid-template-columns:repeat(8,minmax(0,1fr))}}.ys-skill-tile{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;row-gap:.375rem;padding:.75rem .25rem;border-radius:var(--radius-s);transition:border-color var(--dur-base) var(--ease-standard)}.ys-skill-tile:hover{border-color:color-mix(in srgb,var(--primary) 40%,transparent)}.ys-skill-tile:hover .ys-skill-tile__glow{opacity:1}.ys-skill-tile:hover img{scale:1.1}.ys-skill-tile:hover .ys-skill-tile__name{color:var(--text)}.ys-skill-tile img{position:relative;width:1.75rem;height:1.75rem;object-fit:contain;transition:scale 0.3s}.ys-skill-tile svg{position:relative;width:1.75rem;height:1.75rem;color:var(--primary)}@media (min-width:640px){.ys-skill-tile{border-radius:var(--radius-l)}.ys-skill-tile img,.ys-skill-tile svg{width:2rem;height:2rem}}.ys-skill-tile__glow{position:absolute;inset:0;opacity:0;background-image:linear-gradient(135deg,var(--primary-10),transparent);transition:opacity 0.5s;pointer-events:none}.ys-skill-tile__name{position:relative;font-size:10px;color:var(--text-muted);text-align:center;line-height:var(--leading-tight);transition:color 0.3s;display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;max-width:100%}@media (min-width:640px){.ys-skill-tile__name{font-size:var(--text-xs)}}.ys-skills__total{text-align:center;font-size:var(--text-s);color:var(--text-muted);line-height:1.25rem;margin-top:2.5rem}.ys-skills__total .ys-skills__total-num{color:var(--primary);font-weight:700}@media (min-width:640px){.ys-skills__total{font-size:var(--text-m);line-height:1.5rem}}