.skills-domain { margin-top: 28px; }
#skills[open] > .section-content { animation: none; }
.skills-domain + .skills-domain { padding-top: 24px; border-top: 1px dashed var(--line); }
.skills-domain-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.skills-domain-heading h3 { margin: 0; font: 400 11px/1.9 var(--pixel-font); }
.skills-domain-label { color: var(--muted); font-size: 12px; text-align: right; }
.skills-credential { flex-shrink: 0; padding: 3px 8px; border: 1px solid var(--ink); font: 400 9px/1.9 var(--pixel-font); box-shadow: 2px 2px 0 var(--line); }
.skills-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: start; }
.skill-card { min-width: 0; border: 1px solid var(--line); background: var(--surface); }
#skills:not(.skills-enhanced) .skill-card[open] { grid-column: 1 / -1; }
.skill-trigger { display: grid; grid-template-columns: 24px minmax(0, 1fr) 12px; align-items: center; gap: 12px; min-height: 96px; padding: 16px 13px; }
.skill-trigger:hover, .skill-card[open] > .skill-trigger { background: var(--soft); }
.skill-card[open] { border-color: var(--ink); box-shadow: 3px 3px 0 var(--line); }
.skill-card-title { font-size: 14px; font-weight: bold; line-height: 1.5; overflow-wrap: anywhere; }
.skill-icon { width: 24px; height: 24px; fill: currentColor; shape-rendering: crispEdges; }
.skill-indicator { font-size: 18px; line-height: 1; color: var(--muted); }
.skill-indicator::before { content: '+'; }
.skill-card[open] .skill-indicator::before { content: '−'; }
.skill-panel { background: var(--surface); color: var(--ink); padding: 20px; min-width: 0; }
.skill-panel-heading { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.skill-panel h4 { font: 400 10px/1.9 var(--pixel-font); margin: 0; }
[data-skill-close] { display: none; flex-shrink: 0; width: 32px; height: 32px; margin: -6px -6px 0 0; border: 1px solid var(--line); background: var(--surface); font-size: 22px; line-height: 1; cursor: pointer; }
[data-skill-close]:hover { background: var(--soft); border-color: var(--ink); }
.skill-panel dl { margin: 20px 0 0; }
.skill-panel dt, .skill-detail-label { display: block; color: var(--muted); font-size: 11px; font-weight: bold; line-height: 1.6; letter-spacing: 1px; text-transform: uppercase; }
.skill-panel dd { margin: 8px 0 18px; }
.skill-panel .skill-tags, .skills-foundations .skill-tags { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; }
.skill-panel .skill-tags li, .skills-foundations .skill-tags li { margin: 0; padding: 3px 7px; border: 1px solid var(--line); background: var(--soft); font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.skill-tags li::marker { content: ''; }
.skill-project { border-top: 1px solid var(--line); padding-top: 14px; }
.skill-project a { display: inline-block; margin-top: 6px; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.skill-project-status { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; }
.skills-enhanced .skill-panel { visibility: hidden; position: fixed; z-index: 30; width: min(350px, calc(100vw - 32px)); border: 1px solid var(--ink); box-shadow: 5px 5px 0 rgb(0 0 0 / 18%); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.skills-enhanced .is-positioned .skill-panel { visibility: visible; }
.skills-enhanced [data-skill-close] { display: block; }
.skills-foundations { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 28px; padding-top: 22px; border-top: 1px dashed var(--line); }
.skills-foundations h3 { margin: 0 0 12px; font-size: 14px; line-height: 1.6; }
@media (max-width: 1000px) {
  .skills-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .skills-grid { gap: 10px; }
  .skill-trigger { position: relative; grid-template-columns: minmax(0, 1fr); align-content: start; min-height: 132px; padding: 13px; gap: 9px; }
  .skill-icon { grid-column: 1 / -1; width: 20px; height: 20px; }
  .skill-card-title { font-size: 13px; }
  .skill-indicator { position: absolute; top: 13px; right: 13px; }
  .skill-panel { padding: 18px; }
  .skills-domain-heading h3 { font-size: 10px; }
  .skills-domain-label { display: none; }
  .skills-foundations { grid-template-columns: 1fr; gap: 22px; }
}
@media (prefers-reduced-motion: no-preference) {
  .skill-trigger { transition: background-color 120ms ease; }
}
@media print {
  .skills-enhanced .skill-panel { position: static; width: auto; max-height: none !important; box-shadow: none; }
  .skills-enhanced [data-skill-close] { display: none; }
}