/* site.css — oak 위에 이 사이트만 얹는 것. 테마 파일은 건드리지 않는다. */

/* 인쇄물은 잘리면 안 되는 작업이 많다 — 확대 화면·상세에서는 원본 비율 그대로,
   격자 셀만 cover 로 채운다(셀 비율은 projects.json 의 ar 이 원본에 맞춰 고른다). */
.pj-shots img { background: var(--c-bg-alt, #f4f1ec); }

.about-skills ul {
  display: flex; flex-wrap: wrap; gap: var(--sp-2);
  list-style: none; padding: 0; margin: var(--sp-6) 0 0;
}
.about-skills li {
  border: 1px solid var(--c-line); border-radius: 999px;
  padding: .35em .9em; font-size: var(--t-small, .875rem); color: var(--c-muted);
}
.spec a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* 현수막·전개도처럼 비율이 극단적인 작업 — 잘지 않고 통째로 (site.js 가 .pc-fit 을 단다) */
.pcell.pc-fit > img { object-fit: contain; padding: 6%; background: var(--c-bg-alt, #f4f1ec); }

/* 테마의 display 규칙이 hidden 속성을 이긴다(.about-hero 가 flex 로 남았다) — hidden 을 되살린다 */
[hidden] { display: none !important; }

/* 격자 캡션의 제목·분야는 <span> 이라 한 줄로 붙어 '포트폴리오 북편집·카탈로그' 가 된다.
   테마(skeleton-c.css)는 .pc-m 에 margin-top 을 주지만 inline 이라 먹지 않는다. 줄을 나눈다. */
.pcell .pc-t, .pcell .pc-m { display: block; }