:root{--card:var(--surface)}.skill-page .lib-view,html:not(.skill-page) .skill-view{display:none}.skill-search{max-width:560px;margin-bottom:32px}.skill-search__label{margin-bottom:6px;font-size:14px;font-weight:600;display:block}.skill-search__field{position:relative}.skill-search__icon{color:var(--muted);pointer-events:none;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.skill-search input{width:100%;min-height:52px;font:inherit;color:var(--ink);background:var(--surface);appearance:none;border:1px solid #bdbdbd;border-radius:12px;padding:12px 16px 12px 46px;font-size:16px}.skill-search input::placeholder{color:var(--muted);opacity:1}.skill-search input:focus{border-color:var(--ink);box-shadow:0 0 0 3px var(--mint);outline:none}.skill-search input::-webkit-search-cancel-button{cursor:pointer}.skill-search__count{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-height:1.4em;margin-top:10px;font-size:12px}.skill-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.skill-grid[hidden],.skill-item[hidden]{display:none}.skill-item{display:flex}.skill-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);width:100%;color:var(--ink);flex-direction:column;gap:10px;padding:24px;display:flex}a.skill-card{transition:background-color .2s,border-color .2s}a.skill-card:hover{background:var(--mint);border-color:var(--ink)}.skill-card__top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;display:flex}.skill-card__name{letter-spacing:-.01em;overflow-wrap:anywhere;font-size:clamp(22px,2vw,26px);font-weight:600;line-height:1.15}.skill-card__blurb{color:var(--muted);font-size:16px;line-height:1.5}a.skill-card:hover .skill-card__blurb{color:var(--ink)}.skill-card__go{margin-top:auto;padding-top:6px;font-size:15px;font-weight:600}.skill-item--soon .skill-card{background:0 0;border-style:dashed}.skill-item--soon .skill-card__name{color:var(--muted)}.skill-status{font-style:normal;font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--ink);border-radius:var(--pill);white-space:nowrap;padding:6px 10px;font-size:12px;line-height:1}.skill-status--ok{background:var(--mint)}.skill-item--soon .skill-status{border-color:var(--muted);color:var(--muted)}.skill-empty{color:var(--muted);overflow-wrap:anywhere;margin-top:8px;font-size:18px}.skill-empty[hidden]{display:none}.skill-back{border-bottom:1px solid}.skill-back:hover{background:var(--mint);color:var(--ink)}.skill-title{max-width:18ch}.skill-panel{gap:16px;max-width:640px;padding:32px}.skill-panel .ok{background:var(--mint);border-radius:12px;padding:14px 16px;font-size:16px}.skill-panel .ok[hidden],.skill-panel .err[hidden]{display:none}.skill-panel a{border-bottom:1px solid}.skill-panel .err{color:#b00020;font-size:15px}.skill-panel .err:empty{display:none}.skill-form{flex-direction:column;gap:18px;display:flex}.skill-form[hidden]{display:none}.skill-form__field{flex-direction:column;gap:6px;display:flex}.skill-form label{font-size:14px;font-weight:600}.skill-form input[type=text],.skill-form input[type=email]{width:100%;min-height:48px;font:inherit;color:var(--ink);background:var(--surface);border:1px solid #bdbdbd;border-radius:12px;padding:12px 14px;font-size:16px;font-weight:400}.skill-form input[type=text]:focus,.skill-form input[type=email]:focus{border-color:var(--ink);box-shadow:0 0 0 3px var(--mint);outline:none}.skill-form .check{align-items:flex-start;gap:12px;font-size:15px;font-weight:400;line-height:1.5;display:flex}.skill-form .check input{width:24px;height:24px;accent-color:var(--ink);flex:none;margin:1px 0 0}.skill-form .hp{height:0;position:absolute;left:-9999px;overflow:hidden}.skill-form button[type=submit]:disabled{opacity:.5;cursor:default}.skill-note{color:var(--muted);font-size:14px}#verstuurd:target{display:block}#verstuurd:target~form{display:none}.intro:has(~#verstuurd:target){display:none}#verstuurd:focus,#verstuurd:focus-visible{outline:none}:where(.hiw,.hiw-card) button.btn{background:var(--ink);color:#fff;border:2px solid var(--ink);padding:12px 28px;font-size:17px;font-weight:700}:where(.hiw,.hiw-card) button.btn:hover{background:var(--mint);color:var(--ink)}:where(.hiw,.hiw-card) button.btn.alt{color:var(--ink);background:#fff}:where(.hiw,.hiw-card) button.btn.alt:hover{background:var(--mint)}@media (max-width:960px){.skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.skill-grid{grid-template-columns:minmax(0,1fr);gap:12px}.skill-card{padding:20px}.skill-panel{padding:22px 18px}.skill-search{margin-bottom:24px}}@media (prefers-reduced-motion:reduce){a.skill-card{transition:none}}
