.skills-page{--skills-panel:rgba(3,25,37,.76);--skills-panel-hover:rgba(5,39,52,.88);--skills-grid-line:rgba(145,201,213,.16)}
.skills-hero{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);align-items:end;gap:clamp(56px,9vw,150px);min-height:57dvh;padding-top:126px;padding-bottom:68px}
.skills-hero-copy h1{max-width:760px;margin:0 0 22px;font-size:clamp(54px,5.1vw,66px);line-height:.94}
.skills-hero-copy h1 span{display:block}
.skills-hero-copy>p:not(.eyebrow){max-width:31em;margin:0 0 26px;color:var(--muted);font-size:16px;line-height:1.58}
.skills-primary-link,.release-loop a,.skill-card-actions a{display:inline-block;border-bottom:1px solid var(--accent);padding:7px 0;font-family:var(--mono);font-size:8px;letter-spacing:.11em}
.library-snapshot{border-top:1px solid var(--line-strong);padding-top:18px}
.snapshot-primary{display:flex;align-items:baseline;gap:14px;border-bottom:1px solid var(--line);padding-bottom:18px}
.snapshot-primary strong{color:var(--accent);font-family:var(--display);font-size:68px;font-weight:400;letter-spacing:-.06em;line-height:1}
.snapshot-primary span,.library-snapshot dd{color:var(--ink);font-size:12px}
.library-snapshot dl{display:grid;grid-template-columns:1fr 1fr;margin:0}
.library-snapshot dl>div{display:flex;align-items:baseline;gap:10px;padding:17px 0}
.library-snapshot dl>div+div{border-left:1px solid var(--line);padding-left:18px}
.library-snapshot dt{color:var(--accent);font-family:var(--display);font-size:28px}
.library-snapshot dd{margin:0;color:var(--muted)}
.library-snapshot>p{margin:0;border-top:1px solid var(--line);padding-top:14px;color:var(--faint);font-family:var(--mono);font-size:8px;letter-spacing:.07em;line-height:1.55}
.candidate-index{border-top:1px solid var(--line-strong);padding:54px 0 13vh}
.candidate-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:28px}
.candidate-head h2{margin:0 0 8px;font-size:clamp(36px,4vw,55px);line-height:.96}
.candidate-head p{margin:0;color:var(--muted);font-size:13px}
.skill-filters{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.skill-filters button{min-height:38px;border:1px solid var(--line);border-radius:0;padding:0 12px;background:transparent;color:var(--faint);font-family:var(--mono);font-size:7px;letter-spacing:.09em;cursor:pointer}
.skill-filters button span{margin-left:7px;color:var(--muted)}
.skill-filters button:hover{border-color:var(--line-strong);color:var(--ink)}
.skill-filters button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.skill-filters button[aria-pressed="true"]{border-color:var(--accent);background:rgba(255,116,103,.1);color:var(--ink)}
.skill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--skills-grid-line);border:1px solid var(--skills-grid-line)}
.skill-card{display:flex;min-width:0;min-height:326px;flex-direction:column;padding:20px;background:var(--skills-panel);transition:background-color .2s ease,transform .2s ease}
.skill-card:hover{background:var(--skills-panel-hover);transform:translateY(-2px)}
.skill-card[hidden]{display:none}
.skill-card-live{background:linear-gradient(155deg,rgba(255,116,103,.105),var(--skills-panel) 46%)}
@media(min-width:1051px){.skill-grid[data-visible-count="3"]{width:75%;grid-template-columns:repeat(3,minmax(0,1fr))}.skill-grid[data-visible-count="2"]{width:50%;grid-template-columns:repeat(2,minmax(0,1fr))}.skill-grid[data-visible-count="1"]{width:25%;grid-template-columns:minmax(0,1fr)}}
.skill-card-top{display:flex;min-height:34px;align-items:flex-start;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:6.5px;letter-spacing:.08em;line-height:1.35}
.provenance{max-width:15em;color:var(--faint)}
.release-state{flex:none;color:var(--accent)}
.skill-card-body{padding:43px 0 24px}
.skill-path{margin:0 0 12px;color:var(--accent);font-family:var(--mono);font-size:7px;letter-spacing:.06em;overflow-wrap:anywhere}
.skill-card h3{margin:0 0 15px;font-family:var(--ui);font-size:clamp(22px,2vw,28px);font-weight:600;letter-spacing:-.045em;line-height:1.02}
.skill-card h3 a{color:inherit;text-decoration:none}
.skill-card h3 a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.skill-card-body>p:last-child{margin:0;color:var(--muted);font-size:12px;line-height:1.62}
.skill-card-meta{display:grid;grid-template-columns:repeat(3,1fr);margin:auto 0 0;border-top:1px solid var(--line)}
.skill-card-meta>div{padding:13px 6px 0 0}
.skill-card-meta dt{margin-bottom:5px;color:var(--faint);font-family:var(--mono);font-size:6px;letter-spacing:.08em}
.skill-card-meta dd{margin:0;color:var(--ink);font-family:var(--mono);font-size:9px}
.skill-card-note{margin:auto 0 0;border-top:1px solid var(--line);padding-top:13px;color:var(--faint);font-size:10px;line-height:1.55}
.skill-card-actions{display:flex;gap:22px;margin-top:18px}
.skill-card-actions.single{margin-top:auto;border-top:1px solid var(--line);padding-top:10px}
.filter-empty{padding:50px 0;color:var(--muted)}
.release-loop{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr) auto;align-items:center;gap:clamp(30px,6vw,90px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:44px 0}
.release-loop h2{margin:0;font-size:clamp(30px,3.5vw,48px);line-height:1}
.release-loop p{max-width:40em;margin:0;color:var(--muted);font-size:13px;line-height:1.65}
.release-loop a{white-space:nowrap}
.release-rules{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:clamp(50px,9vw,140px);padding:11vh 0 14vh}
.release-rules header h2{margin:0 0 14px;font-size:clamp(38px,4.6vw,66px);line-height:.95}
.release-rules header p{max-width:24em;margin:0;color:var(--muted);font-size:13px;line-height:1.6}
.rules-list{margin:0;padding:0;list-style:none}
.rules-list li{display:grid;grid-template-columns:46px 1fr;gap:18px;border-top:1px solid var(--line);padding:22px 0}
.rules-list li:last-child{border-bottom:1px solid var(--line)}
.rules-list>li>span{color:var(--accent);font-family:var(--mono);font-size:9px}
.rules-list strong{display:block;margin-bottom:7px;font-family:var(--ui);font-size:18px}
.rules-list p{margin:0;color:var(--muted);font-size:12px;line-height:1.58}
@media(max-width:1050px){.skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.skill-card{min-height:300px}.candidate-head{align-items:flex-start;flex-direction:column}.skill-filters{justify-content:flex-start}.release-loop{grid-template-columns:1fr 1.2fr}.release-loop a{grid-column:1/-1;justify-self:start}}
@media(max-width:680px){.skills-hero{display:block;min-height:auto;padding-top:112px;padding-bottom:58px}.skills-hero-copy h1{font-size:clamp(52px,14.5vw,68px)}.skills-hero-copy>p:not(.eyebrow){font-size:14px}.library-snapshot{margin-top:54px}.snapshot-primary strong{font-size:56px}.library-snapshot dl>div{align-items:flex-start;flex-direction:column;gap:3px}.candidate-index{padding-top:42px;padding-bottom:82px}.candidate-head{gap:24px}.candidate-head h2{font-size:40px}.skill-filters{display:grid;width:100%;grid-template-columns:1fr 1fr}.skill-filters button{width:100%}.skill-grid{grid-template-columns:1fr}.skill-card{min-height:286px;padding:19px}.skill-card-body{padding-top:36px}.skill-card h3{font-size:27px}.release-loop{grid-template-columns:1fr;gap:20px;padding:38px 0}.release-loop a{grid-column:auto}.release-rules{grid-template-columns:1fr;gap:42px;padding:78px 0 88px}.release-rules header h2{font-size:47px}}

.skills-hero-copy h1{max-width:17ch;font-size:clamp(46px,4.4vw,58px);line-height:1}
.candidate-head h2,.release-rules header h2{font-size:clamp(34px,3.5vw,48px);line-height:1.04}
html[lang="zh-CN"] .skills-page h1,html[lang="zh-CN"] .skills-page h2{font-family:var(--ui);font-weight:600;letter-spacing:-.04em;line-height:1.14}
html[lang="zh-CN"] .skills-hero-copy h1{max-width:none;font-size:clamp(40px,3.8vw,50px)}
@media(max-width:900px){
  .skills-hero{grid-template-columns:1fr;align-items:start;gap:44px;min-height:auto;padding-top:126px}
  .skills-hero-copy h1{max-width:18ch;font-size:44px}
  html[lang="zh-CN"] .skills-hero-copy h1{max-width:none;font-size:40px}
  .library-snapshot{max-width:560px}
}
@media(max-width:680px){
  .skills-hero-copy h1{max-width:16ch;font-size:40px;line-height:1.04}
  .candidate-head h2,.release-rules header h2{font-size:34px;line-height:1.1}
  html[lang="zh-CN"] .skills-hero-copy h1{max-width:none;font-size:34px;line-height:1.18}
}
@media(prefers-reduced-motion:reduce){.skill-card{transition:none}.skill-card:hover{transform:none}}