/* A compact skill index with an anchored, layered work drawer. */
.skills-section{margin-top:40px;padding-top:29px;border-top:1px solid var(--line)}
.skills-section .section-heading h2{font-size:24px}
.skill-library{margin-top:24px}
.skill-group{display:grid;grid-template-columns:142px minmax(0,1fr);gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}
.skill-group:first-child{padding-top:0}
.skill-group:last-child{border-bottom:0;padding-bottom:0}
.skill-group h3{font-size:14px;font-weight:500;color:var(--muted);line-height:1.6;padding-top:8px}
.skill-buttons{display:flex;flex-wrap:wrap;gap:8px}
.skill-chip{display:inline-flex;align-items:center;gap:9px;min-height:37px;padding:6px 11px;border:1px solid var(--line);border-radius:9px;background:linear-gradient(165deg,#fff,#f7faff);color:#405e82;font-size:14px;line-height:1.5;text-align:left;transition:background .2s,border-color .2s,box-shadow .2s,transform .25s var(--ease)}
.skill-chip::after{content:'+';font-size:15px;line-height:1;font-weight:400;color:#7595bc;transition:transform .25s var(--ease)}
.skill-chip[aria-expanded=true]{color:var(--navy);border-color:#90b7eb;background:#edf5ff;box-shadow:0 0 0 3px #80b6f216}
.skill-chip[aria-expanded=true]::after{transform:rotate(45deg)}
.work-skill-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px}
.work-skill-tags .skill-chip{font-size:13px;min-height:29px;padding:3px 8px;border-radius:6px;background:transparent;gap:7px}
.work-skill-tags .skill-chip::after{font-size:12px}
.skill-popover{position:fixed;inset:auto;margin:0;width:420px;max-width:calc(100vw - 24px);max-height:75dvh;padding:0;overflow:visible;border:1px solid #cbdcf0;border-radius:17px;background:#ffffffed;backdrop-filter:blur(26px) saturate(1.5);-webkit-backdrop-filter:blur(26px) saturate(1.5);box-shadow:0 22px 65px -18px #173b6740,0 4px 14px #2045700c;color:var(--ink);transform-origin:var(--origin-x,50%) var(--origin-y,100%)}
.skill-popover:popover-open{display:flex;flex-direction:column;animation:skill-drawer-in .3s var(--ease)}
.skill-popover::before{content:'';position:absolute;left:var(--tip-x,50%);bottom:-6px;width:11px;height:11px;transform:translateX(-50%) rotate(45deg);border-right:1px solid #cbdcf0;border-bottom:1px solid #cbdcf0;background:#fff;pointer-events:none}
.skill-popover[data-side=below]::before{top:-6px;bottom:auto;transform:translateX(-50%) rotate(225deg)}
.skill-popover::backdrop{background:transparent}
.skill-drawer-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 20px 16px;border-bottom:1px solid var(--line);flex-shrink:0}
.skill-drawer-heading h3{font-size:21px;letter-spacing:-.4px;line-height:1.3}
.skill-drawer-count{display:block;font-size:12px;color:var(--muted);margin-top:4px;font-variant-numeric:tabular-nums}
.skill-drawer-close{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--text)}
.skill-drawer-close svg{width:15px;height:15px}
.skill-work-list{list-style:none;margin:0;padding:7px;overflow-y:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin;border-radius:0 0 17px 17px}
.skill-work-list>li{animation:skill-row-in .32s var(--ease) both;animation-delay:calc(var(--row)*28ms)}
.skill-work-link{display:grid;grid-template-columns:49px minmax(0,1fr);gap:13px;align-items:start;padding:12px;border-radius:11px;color:var(--ink);transition:background .2s,box-shadow .2s}
.skill-work-link:hover{text-decoration:none;background:#edf4fcd9}
.skill-work-image{display:block;width:49px;height:49px;overflow:hidden;border-radius:10px;border:1px solid #dce6f2;background:var(--surface)}
.skill-work-image img{width:100%;height:100%;object-fit:cover;object-position:top}
.skill-work-image[data-work=kitchen] img{object-position:center 19%}
.skill-work-monogram{display:grid;place-items:center;font-size:18px;font-weight:600;color:var(--navy);background:#f2f6fc}
.skill-work-title{display:flex;align-items:baseline;gap:9px;justify-content:space-between;font-size:15px;font-weight:600;line-height:1.45}
.skill-work-current{font-size:12px;font-weight:400;color:var(--blue);flex-shrink:0}
.skill-work-use{display:block;font-size:13px;line-height:1.6;color:var(--text);margin-top:4px}
.skill-work-scope{display:block;font-size:12px;line-height:1.5;color:var(--muted);margin-top:5px}
.detail-skill-section{margin-top:25px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.detail-skill-section h3{font-size:16px;letter-spacing:-.2px;margin-bottom:13px}
.detail-skill-section .skill-chip{background:transparent}
.detail-skill-section .skill-chip.is-highlighted{color:var(--navy);background:#eaf4ff;border-color:#98bce9;box-shadow:0 0 0 3px #8cb6e91a}
.detail-skill-evidence{display:flex;gap:12px;align-items:baseline;margin-top:16px;padding:13px 15px;border-radius:10px;background:var(--surface);font-size:14px;color:var(--text);line-height:1.7}
.detail-skill-evidence strong{color:var(--navy);font-weight:550;flex-shrink:0}
.detail-skill-evidence small{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.skill-experience-link{margin-top:12px}
:root[data-theme=dark] .skill-chip{background:linear-gradient(145deg,#12253980,#211d3680);border-color:#30405a;color:#bfd3e9}
:root[data-theme=dark] .skill-chip::after{color:#99bed7}
:root[data-theme=dark] .skill-chip[aria-expanded=true],:root[data-theme=dark] .detail-skill-section .skill-chip.is-highlighted{color:#c1f7ff;background:#193347;border-color:#5f9eb3;box-shadow:0 0 0 3px #76d9f014}
:root[data-theme=dark] .skill-popover{background:#0f1b2bef;border-color:#395675;box-shadow:0 25px 70px -16px #000a,0 0 30px #73a7ed0e}
:root[data-theme=dark] .skill-popover::before{background:#111d2d;border-color:#395675}
:root[data-theme=dark] .skill-work-link:hover{background:#203248b3}
:root[data-theme=dark] .skill-work-image{border-color:#3a4d66}
:root[data-theme=dark] .skill-work-monogram{background:#1a3044}
:root[data-theme=dark] .detail-skill-evidence{background:#142335}
@media(hover:hover){.skill-chip:hover{border-color:#a7c4e9;box-shadow:0 3px 11px #234c7510;transform:translateY(-1px)}:root[data-theme=dark] .skill-chip:hover{border-color:#7596b0;box-shadow:0 0 15px #71b2dc12}}
@keyframes skill-drawer-in{from{opacity:0;transform:translateY(var(--enter-y,10px)) scale(.97)}to{opacity:1;transform:none}}
@keyframes skill-row-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:600px){.skills-section{margin-top:34px;padding-top:27px}.skills-section .section-heading h2{font-size:24px}.skill-library{margin-top:24px}.skill-group{grid-template-columns:1fr;gap:11px;padding:18px 0}.skill-group h3{padding:0;font-size:13px}.skill-chip{min-height:40px;padding:7px 10px}.skill-popover{border-radius:20px;max-height:72dvh}.skill-popover::before{display:none}.skill-drawer-heading{padding:19px 18px 15px}.skill-work-link{padding:12px 10px;gap:12px}.skill-work-list{padding:6px}.skill-work-use{font-size:14px}.detail-skill-evidence{display:block}.detail-skill-evidence strong{display:block;margin-bottom:4px}.detail-skill-section .skill-chip{min-height:37px}.work-skill-tags .skill-chip{min-height:32px}.skill-drawer-close{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.skill-popover:popover-open,.skill-work-list>li{animation:none}.skill-chip,.skill-chip::after,.skill-work-link{transition:none}.skill-chip:hover{transform:none}}
