.skills-page{--skills-scene-tint:#36d7dc;--skills-scene-soft:#eefbfa;background:radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--skills-scene-tint), transparent 84%), transparent 28rem), radial-gradient(circle at 84% 74%, color-mix(in srgb, var(--skills-scene-tint), transparent 90%), transparent 30rem), linear-gradient(135deg, #fbfbfb, var(--skills-scene-soft));color:#050505;isolation:isolate;min-height:100svh;padding-top:72px;transition:background-color .52s;position:relative;overflow:clip}.skills-page[data-open=true]{min-height:100svh}.skills-page *{letter-spacing:0}.skills-grid{background:color-mix(in srgb, var(--skills-scene-tint), #fbfbfb 96%);perspective:76rem;border-top:1px solid #d7d7d7;border-left:1px solid #d7d7d7;grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(6,minmax(0,1fr));min-height:calc(100svh - 72px);transition:background-color .52s;display:grid}.skills-grid__cell{--skill-proximity:0;background:color-mix(in srgb, var(--skills-scene-tint), #fbfbfb 97%);color:#050505;min-width:0;min-height:0;transform-style:preserve-3d;box-shadow:inset 0 0 0 calc(var(--skill-proximity) * 2px) color-mix(in srgb, var(--skill-live-accent,var(--skill-family-accent,var(--skills-scene-tint))), transparent 22%), 0 calc(var(--skill-proximity) * 1.2rem) calc(var(--skill-proximity) * 2.8rem) color-mix(in srgb, var(--skill-live-accent,var(--skill-family-accent,var(--skills-scene-tint))), transparent 78%);will-change:opacity;border:1px solid #d7d7d7;border-top:0;border-left:0;place-items:center;transition:background-color .24s,border-color .24s,box-shadow .24s,opacity .24s,filter .24s;display:grid;position:relative;overflow:hidden}.skills-grid__cell-shell,.skills-family-visual__core,.skills-live__drifter,.skills-live__payload{will-change:transform, opacity}.skills-grid__cell-shell{width:100%;min-width:0;height:100%;transform:translate3d(0, calc(var(--skill-proximity) * -.28rem), 0) scale(calc(1 + (var(--skill-proximity) * .026)));transform-style:preserve-3d;filter:brightness(calc(1 + (var(--skill-proximity) * .08)));place-items:center;transition:filter .18s,transform .18s;display:grid;position:relative}.skills-grid__cell--live{background:radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--skill-live-accent), transparent 88%), transparent 44%), color-mix(in srgb, var(--skills-scene-tint), #fbfbfb 97%)}.skills-grid__cell--live:before{content:"";border:1px solid color-mix(in srgb, var(--skill-live-accent), transparent 68%);opacity:0;animation:7.2s ease-in-out infinite skillsLiveField;position:absolute;inset:18%;transform:scale(.76)}.skills-live__drifter{transform-style:preserve-3d;place-items:center;display:grid;position:relative}.skills-live__payload{opacity:0;pointer-events:none;transform-style:preserve-3d;backface-visibility:hidden;grid-area:1/1;place-items:center;display:grid;transform:translateY(.7rem)scale(.96)rotate(-1.4deg)}.skills-live__payload[data-active=true]{z-index:1;opacity:1;animation:1.6s cubic-bezier(.19,1,.22,1) both skillsPayloadPop;transform:translateY(0)scale(1)rotate(0)}.skills-live-letter{font-family:var(--font-serif);letter-spacing:0;color:#050505;transform-origin:50% 82%;animation:1.85s ease-in-out infinite skillsLiveLetterDance;animation-delay:calc(var(--skill-live-delay,0) * -95ms);font-size:clamp(4.1rem,6vw,7rem);font-weight:700;line-height:1}.skills-live-visual{transform-origin:50%;width:clamp(6.5rem,9.2vw,9.8rem);height:clamp(6.5rem,9.2vw,9.8rem);animation:2.2s ease-in-out infinite skillsLiveIconDance;animation-delay:calc(var(--skill-live-delay,0) * -74ms);display:block;overflow:visible}.skills-live-visual__halo{fill:color-mix(in srgb, var(--skill-live-accent), white 72%);stroke:#050505;stroke-width:4px}.skills-live-visual__line,.skills-live-visual__route,.skills-live-visual__scan{fill:none;stroke:#050505;stroke-width:6px;stroke-linecap:round;stroke-linejoin:round}.skills-live-visual__route{stroke:var(--skill-live-accent);stroke-dasharray:8 12;animation:2.8s linear infinite skillsLiveRoute}.skills-live-visual__scan{stroke:var(--skill-live-accent);animation:1.9s ease-in-out infinite alternate skillsLiveScan}.skills-live-visual__node,.skills-live-visual__spark{fill:var(--skill-live-accent);stroke:#050505;stroke-width:4px}.skills-live-visual__node{transform-box:fill-box;transform-origin:50%;animation:1.7s ease-in-out infinite skillsLiveNode}.skills-live-visual__spark{fill:#ff624d;animation:1.55s ease-in-out infinite alternate skillsLiveSpark}.skills-grid__cell--skill{cursor:pointer;appearance:none;grid-template-rows:minmax(0,1fr) auto;align-items:stretch;min-width:0;padding:clamp(.72rem,1.2vw,1.1rem)}.skills-grid__cell--skill .skills-grid__cell-shell{grid-template-rows:minmax(0,1fr) auto;align-items:stretch}.skills-grid__cell--skill:hover,.skills-grid__cell--skill:focus-visible{background:color-mix(in srgb, var(--skill-family-accent), #fbfbfb 88%);outline:none}.skills-grid__cell--skill:focus-visible{box-shadow:inset 0 0 0 3px #050505}.skills-grid__cell-index{font-family:var(--font-mono);font-size:.82rem;position:absolute;top:1rem;left:1rem}.skills-grid__skill-copy{text-align:left;justify-content:space-between;align-items:end;gap:1rem;width:100%;min-width:0;display:flex}.skills-grid__skill-copy strong{min-width:0;font-family:var(--font-display);overflow-wrap:anywhere;font-size:clamp(1.15rem,1.35vw,1.5rem);line-height:1}.skills-grid__skill-copy small{max-width:8.7rem;font-family:var(--font-mono);text-align:right;text-transform:uppercase;overflow-wrap:anywhere;font-size:clamp(.58rem,.68vw,.72rem);line-height:1.2}.skills-family-visual{place-self:center}.skills-brain{place-items:center;width:clamp(6.4rem,7.8vw,8.1rem);height:clamp(6.4rem,7.8vw,8.1rem);display:grid;position:relative}.skills-brain__pulse,.skills-brain__orbit{border-radius:999px;position:absolute;inset:0}.skills-brain__pulse{opacity:0;background:#36d7dc;animation:3.2s linear infinite skillsBrainBurst}.skills-brain__pulse:nth-child(2){animation-delay:-1.6s}.skills-brain__orbit{border:1px solid #0505052e}.skills-brain__orbit--one{border-color:#36d7dc6b;inset:1rem}.skills-brain__orbit--two{border-style:dashed;border-color:#05050533;animation:8s linear infinite reverse skillsBrainSpin;inset:2.1rem}.skills-brain__shell{z-index:2;color:#061111;background:radial-gradient(circle at 34% 28%,#ffffffdb,#0000 24%),radial-gradient(circle at 68% 70%,#ffdf3d6b,#0000 30%),linear-gradient(145deg,#37e1e6,#f4ffff 58%,#d8ff63);border:2px solid #050505c7;border-radius:42% 49% 44% 48%;place-items:center;width:clamp(4.65rem,5.3vw,5.7rem);height:clamp(4.65rem,5.3vw,5.7rem);display:grid;position:relative;box-shadow:0 1.1rem 2.6rem #36d7dc42,inset 0 -.75rem 1.2rem #0505051f}.skills-brain__shell svg{width:clamp(3.3rem,4.1vw,4.4rem);height:clamp(3.3rem,4.1vw,4.4rem);overflow:visible}.skills-eye{place-items:center;width:clamp(6.7rem,8.8vw,8.6rem);height:clamp(6.7rem,8.8vw,8.6rem);display:grid;position:relative}.skills-eye__halo{background:radial-gradient(circle,#00c7d429,#0000 64%),radial-gradient(circle at 68% 34%,#ffdf3d2e,#0000 28%);border:1px solid #00c7d452;border-radius:999px;animation:3.6s linear infinite skillsBrainBurst;position:absolute;inset:.25rem}.skills-eye__image{z-index:1;filter:drop-shadow(0 1rem 1.6rem #00c7d42e);border-radius:999px;width:100%;height:100%;position:relative}.skills-eye__image img{object-fit:contain}.skills-detail{z-index:18;color:#f7f7f1;will-change:transform, opacity;background:#101010;outline:none;height:calc(100svh - 72px);display:none;position:fixed;inset:72px 0 0;overflow:hidden}.skills-detail__content{grid-template-columns:minmax(18rem,.88fr) minmax(0,2fr);height:100%;min-height:0;display:grid}.skills-detail__intro{background:radial-gradient(circle at 18% 18%,#36d7dc38,#0000 31%),radial-gradient(circle at 82% 72%,#ff624d2e,#0000 28%),#101010;border-right:1px solid #ffffff29;flex-direction:column;justify-content:start;gap:1.15rem;padding:6.5rem 2rem 2rem;display:flex;position:relative}.skills-detail__close{color:#f7f7f1;cursor:pointer;background:0 0;border:1px solid #f7f7f15c;border-radius:999px;place-items:center;width:2.9rem;height:2.9rem;display:grid;position:absolute;top:1.25rem;left:1.25rem}.skills-detail__close:hover,.skills-detail__close:focus-visible{color:#36d7dc;border-color:#36d7dc;outline:none}.skills-detail__eyebrow{font-family:var(--font-mono);text-transform:uppercase;color:#36d7dc;margin:0;font-size:.78rem}.skills-detail__intro h2{font-family:var(--font-display);margin:0;font-size:4.8rem;line-height:.95}.skills-detail__intro p{color:#f7f7f1d1;max-width:31rem;margin:0;font-size:1.02rem;line-height:1.55}.skills-detail__intro dl{gap:.85rem;margin:1rem 0 0;display:grid}.skills-detail__intro dt{font-family:var(--font-mono);text-transform:uppercase;color:#f7f7f17a;margin:0 0 .2rem;font-size:.74rem}.skills-detail__intro dd{color:#f7f7f1e6;overflow-wrap:anywhere;margin:0;font-size:.92rem;line-height:1.45}.skills-detail__cards{overscroll-behavior:contain;scrollbar-gutter:stable;background:#cfcfcf;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:1px;height:100%;min-height:0;padding:1px;display:grid;overflow-y:auto}.skills-detail__card{color:#050505;text-align:left;cursor:pointer;will-change:transform, opacity;background:#fbfbfb;border:0;border-radius:0;grid-template-rows:auto auto auto auto 1fr auto;align-content:start;min-height:18.5rem;padding:1.2rem;transition:background-color .18s,transform .18s,box-shadow .18s;display:grid;position:relative}.skills-detail__card:before{content:"";background:var(--skill-card-accent);transform-origin:0;height:.28rem;transition:transform .18s;position:absolute;inset:0 0 auto;transform:scaleX(0)}.skills-detail__card:hover,.skills-detail__card:focus-visible,.skills-detail__card[data-active=true]{z-index:1;box-shadow:inset 0 0 0 2px var(--skill-card-accent);background:#fff;outline:none}.skills-detail__card:hover:before,.skills-detail__card:focus-visible:before,.skills-detail__card[data-active=true]:before{transform:scaleX(1)}.skills-detail__card svg{color:var(--skill-card-accent);margin:2.7rem 0 1rem}.skills-detail__card-number{font-family:var(--font-mono);color:#0505058a;font-size:.76rem;position:absolute;top:1rem;right:1rem}.skills-detail__card small{font-family:var(--font-mono);color:#0505058f;text-transform:uppercase;margin-bottom:.32rem;font-size:.74rem}.skills-detail__card strong{font-family:var(--font-display);font-size:1.35rem;line-height:1.08;display:block}.skills-detail__card p{color:#050505b8;margin:.8rem 0 1rem;font-size:.92rem;line-height:1.44}.skills-detail__card code{width:fit-content;max-width:100%;font-family:var(--font-mono);color:#050505;overflow-wrap:anywhere;border:1px solid #0505052e;border-radius:6px;align-self:end;padding:.32rem .45rem;font-size:.75rem}@keyframes skillsBrainSpin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes skillsBrainBurst{0%{opacity:.42;transform:scale(.62)}to{opacity:0;transform:scale(1.07)}}@keyframes skillsLiveField{0%,to{opacity:0;transform:scale(.76)rotate(0)}45%{opacity:.64;transform:scale(1.08)rotate(4deg)}}@keyframes skillsLiveRoute{to{stroke-dashoffset:-40px}}@keyframes skillsPayloadPop{0%{filter:blur(.12rem)}28%{filter:blur();transform:translateY(-.16rem)scale(1.08)rotate(1.8deg)}58%{transform:translateY(.08rem)scale(.98)rotate(-1deg)}to{filter:blur();transform:translateY(0)scale(1)rotate(0)}}@keyframes skillsLiveLetterDance{0%,to{letter-spacing:0;text-shadow:0 0 #05050500;transform:translate(0,0)rotate(-2deg)skew(-1deg)scale(1)}24%{letter-spacing:.018em;transform:translate(.08em,-.1em)rotate(4deg)skew(3deg)scale(1.08,1.13)}52%{letter-spacing:-.012em;text-shadow:.04em .05em 0 color-mix(in srgb, var(--skill-live-accent), transparent 56%);transform:translate(-.07em,.06em)rotate(-5deg)skew(-4deg)scale(.98,.9)}76%{letter-spacing:.01em;transform:translate(.04em,-.04em)rotate(2deg)skew(2deg)scale(1.04,1.08)}}@keyframes skillsLiveIconDance{0%,to{transform:translate(0,0)rotate(-1.5deg)scale(1)}32%{transform:translate(.18rem,-.28rem)rotate(4deg)scale(1.06)}66%{transform:translate(-.2rem,.18rem)rotate(-4.5deg)scale(.97)}}@keyframes skillsLiveScan{0%{transform:translate(-.45rem)}to{transform:translate(.45rem)}}@keyframes skillsLiveNode{0%,to{transform:scale(.82)}50%{transform:scale(1.12)}}@keyframes skillsLiveSpark{0%{opacity:.45;transform:scale(.72)}to{opacity:1;transform:scale(1.15)}}@media (min-width:1320px){.skills-live-letter{font-size:clamp(5.8rem,6vw,7.2rem)}.skills-detail__intro{padding-inline:3rem}}@media (max-width:1080px){.skills-grid{grid-template-rows:repeat(6,minmax(12rem,1fr));grid-template-columns:repeat(3,minmax(0,1fr))}.skills-detail{overscroll-behavior:contain;overflow-y:auto}.skills-detail__content{grid-template-columns:1fr;height:auto;min-height:calc(100svh - 72px)}.skills-detail__intro{border-bottom:1px solid #ffffff29;border-right:0;min-height:28rem}.skills-detail__cards{grid-template-columns:repeat(2,minmax(0,1fr));height:auto;overflow:visible}}@media (max-width:700px){.skills-page{padding-top:68px}.skills-grid{grid-template-rows:repeat(9,minmax(11.2rem,1fr));grid-template-columns:repeat(2,minmax(0,1fr));min-height:calc(100svh - 68px)}.skills-grid__cell{min-height:11.5rem}.skills-live-letter{font-size:4.5rem}.skills-live-visual{width:6.6rem;height:6.6rem}.skills-brain{width:6.9rem;height:6.9rem}.skills-brain__shell{width:4.9rem;height:4.9rem}.skills-brain__shell svg:first-child{width:3.45rem;height:3.45rem}.skills-eye{width:7.1rem;height:7.1rem}.skills-grid__skill-copy{flex-direction:column;align-items:start;gap:.25rem}.skills-grid__skill-copy small{text-align:left}.skills-detail__intro{padding:5.4rem 1.1rem 1.4rem}.skills-detail__intro h2{font-size:3.2rem}.skills-detail__intro p{font-size:.95rem}.skills-detail__cards{grid-template-columns:1fr}.skills-detail__card{min-height:16rem}}@media (prefers-reduced-motion:reduce){.skills-brain,.skills-brain__pulse,.skills-brain__orbit--two,.skills-grid__cell--live:before,.skills-live-visual__route,.skills-live-visual__scan,.skills-live-visual__node,.skills-live-visual__spark,.skills-live-letter,.skills-live-visual,.skills-live__payload[data-active=true]{animation:none}.skills-live__payload{transition:none}}@media (max-width:900px){.skills-detail{height:calc(100svh - 84px);inset:84px 0 0}.skills-detail__content{min-height:calc(100svh - 84px)}}
