.skills__header{padding-left:var(--space-14);margin-bottom:var(--space-16)}.skills__intro{margin-top:var(--space-6);font-family:var(--subtitle-font);font-style:italic;font-size:var(--subtitle-size);font-weight:var(--subtitle-weight);color:var(--ink-mid);line-height:var(--subtitle-line);max-width:var(--subtitle-max)}.skills__grid{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--space-20);padding-left:var(--space-14)}.skills__col{display:flex;flex-direction:column;gap:2.75rem}.skill{display:flex;flex-direction:column;gap:var(--space-3)}.skill__meta{display:flex;align-items:center;gap:var(--space-4)}.skill__icon-wrapper{flex-shrink:0;width:44px;height:44px;border-radius:var(--radius-full);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;background:var(--ivory-card);transition:border-color 300ms ease,background 300ms ease}.skill:hover .skill__icon-wrapper{border-color:var(--caramel-pale);background:var(--caramel-pale)}.skill__icon{width:22px;height:22px;flex-shrink:0;display:block;color:var(--ink-base);transition:color 300ms ease,transform 300ms ease}.skill:hover .skill__icon{color:var(--caramel);transform:scale(1.1)}.skill__icon--html,.skill__icon--css{width:20px;height:20px}.skill__icon--js{width:20px;height:20px;border-radius:3px}.skill__icon--react{width:24px;height:24px}.skill__icon--node{width:22px;height:22px}.skill__icon--lovart{width:20px;height:20px}.skill__icon--claude{width:22px;height:22px}.skill__icon--supabase{width:20px;height:20px}.skill__name{flex:1 1 0;font-family:var(--font-body);font-size:var(--text-base);font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-base)}.skill__percent{font-family:var(--font-display);font-size:var(--title-xs);font-weight:400;font-style:italic;color:var(--ink-mid);white-space:nowrap;min-width:3rem;text-align:right}.skill__bar{width:100%;height:1px;background:var(--border);border-radius:var(--radius-sm);position:relative}.skill__bar-fill{position:absolute;top:0;left:0;height:100%;width:0;background:var(--ink-deep);border-radius:var(--radius-sm);transition:width 900ms cubic-bezier(0.16,1,0.3,1)}.skill__bar-fill::after{content:'';position:absolute;pointer-events:none;right:-3px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:var(--radius-pill);background-color:var(--caramel);opacity:0;transition:opacity 300ms ease 600ms}.skill__bar-fill.is-filled::after{opacity:1}@media (max-width:1024px){.skills__header,.skills__grid{padding-left:var(--space-10)}.skills__grid{column-gap:var(--space-12)}}@media (max-width:768px){.skills__header,.skills__grid{padding-left:0}.skills__grid{grid-template-columns:1fr;row-gap:var(--space-10)}.skills__col{gap:2rem}.skills__header{margin-bottom:var(--space-12)}}@media (prefers-reduced-motion:reduce){.skill__bar-fill{transition:none}}