/* Hallmark · shape: app screen · theme: custom Reqeo ledger · genre: modern-minimal · v2.0.0 · signature: readable records, open gallery · redesign: full */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 · weakest: S, existing brand and real output samples retained */
/* App scope: data density is intentional; no fabricated metrics, imagery or interactions. */
body .ui-nav-disclosure { margin: 0; border: 0; padding: 0; background: none; }
body .ui-nav-disclosure > summary { display: none; }
body .ui-admin-layout .op-nav { background: none; padding: 0 16px 0 0; border: 0; border-right: 1px solid var(--ui-line); border-radius: 0; }
body .ui-admin-layout .op-nav a { border-radius: 5px; padding-inline: 12px; text-decoration: none; }
body .ui-admin-layout .op-nav a[aria-current="page"] { background: var(--ui-tint); color: var(--ui-brand-dark); box-shadow: inset 3px 0 var(--ui-brand); }
body .op-filters { border: 0; border-block: 1px solid var(--ui-line); border-radius: 0; padding: 20px 0; background: none; }
body .ui-table-scroll { border-radius: 6px; }
body.skills-admin-page .content-body.skills-admin { background: none; border: 0; border-radius: 0; padding: 0; box-shadow: none; }
body.skills-admin-page .skills-admin :is(.sk-chips,#sk-admin-tabs) { flex-wrap: wrap; overflow: visible; }
body.skills-admin-page .skills-admin .sk-chip { flex: 0 1 auto; white-space: normal; }
body .ui-table-frame { container-type: inline-size; max-width: 100%; min-width: 0; }
body main#main-content table.ui-adaptive-table { display: table; width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; }
body main#main-content table.ui-adaptive-table col { width: auto; }
body main#main-content table.ui-adaptive-table :is(th,td) { min-width: 0; max-width: none; width: auto; white-space: normal; overflow-wrap: anywhere; word-break: normal; text-align: left; vertical-align: top; font-size: 13px; line-height: 1.6; }
body main#main-content table.ui-adaptive-table :is(input,select,button,a) { max-width: 100%; overflow-wrap: anywhere; white-space: normal; }
body main#main-content table.ui-adaptive-table :is(pre,code) { white-space: pre-wrap; overflow-wrap: anywhere; }
body main :is(pre,.sk-code,.ak-code) { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; }
body main :is(.sk-tabs,.ar-tabs) { flex-wrap: wrap; min-width: 0; }
body main :is(.sk-head,.ska-heading,.sk-listhead) > * { min-width: 0; }
body main :is(.sk-head-actions,.sk-actions,.sk-card-foot) { flex-wrap: wrap; }
body .ui-catalog { max-width: 1224px; }
body .ui-catalog .sk-head { padding-block: 16px 24px; margin-bottom: 12px; border-bottom: 1px solid var(--ui-line); }
body .ui-catalog .sk-head h1 { max-width: 780px; font-size: clamp(28px, 3.1vw, 44px); line-height: 1.25; letter-spacing: -.045em; text-wrap: balance; }
body .ui-catalog .sk-head p { max-width: 650px; line-height: 1.7; margin-top: 16px; }
body .ui-catalog .sk-search { background: none; border: 0; border-radius: 0; padding: 0; box-shadow: none; }
body .ui-catalog .sk-grid { gap: 32px 24px; }
body .ui-catalog .sk-card { padding: 0 0 16px; border: 0; border-bottom: 1px solid var(--ui-line); border-radius: 0; background: none; box-shadow: none; transform: none; }
body .ui-catalog .sk-card:hover { border-color: var(--ui-brand); box-shadow: none; transform: none; }
body .ui-catalog .sk-card-thumb { width: 100%; margin: 0 0 20px; border-radius: 6px; overflow: clip; }
body .ui-catalog .sk-card h2 { font-size: 19px; font-weight: 700; }
body .ui-catalog .sk-card p { font-size: 14px; line-height: 1.7; }
body .ui-catalog .sk-card-foot { border-top: 0; padding-top: 16px; }
body .ui-catalog .sk-card-foot strong { font-variant-numeric: tabular-nums; }
body .ui-catalog .sk-card:focus-visible, body .ui-nav-disclosure > summary:focus-visible { outline: 3px solid var(--ui-brand); outline-offset: 4px; }
@container (max-width: 1100px) {
    body main#main-content table.ui-table-wide { display: block; }
    body main#main-content table.ui-table-wide colgroup { display: none; }
    body main#main-content table.ui-table-wide thead { position: absolute; width: 1px; height: 1px; overflow: clip; clip-path: inset(50%); }
    body main#main-content table.ui-table-wide tbody { display: block; }
    body main#main-content table.ui-table-wide tbody tr { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px 24px; padding: 20px; border-bottom: 1px solid var(--ui-line); }
    body main#main-content table.ui-table-wide tbody :is(td,th) { display: block; border: 0; padding: 0; }
    body main#main-content table.ui-table-wide tbody :is(td,th)::before { content: attr(data-label); display: block; color: var(--ui-muted); font-size: 12px; margin-bottom: 4px; }
    body main#main-content table.ui-table-wide tbody .ui-cell-full { grid-column: 1 / -1; }
    body main#main-content table.ui-table-wide caption { display: block; width: auto; padding: 0 0 8px; }
}
@media (max-width: 60rem) {
    body .ui-account-layout { grid-template-columns: minmax(0,1fr); }
    body :is(.ui-admin-layout,.ui-account-layout) > :is(.op-nav,.ac-nav) { position: static; max-height: none; border: 1px solid var(--ui-line); border-radius: 6px; padding: 0; background: var(--ui-paper); overflow: visible; }
    body .ac-nav-title { display: none; }
    body .ui-nav-disclosure > summary { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 12px 16px; cursor: pointer; list-style: none; font-size: 14px; }
    body .ui-nav-disclosure > summary::-webkit-details-marker { display: none; }
    body .ui-nav-disclosure > summary span { color: var(--ui-muted); }
    body .ui-nav-disclosure > summary strong { margin-left: auto; color: var(--ui-ink); font-weight: 600; }
    body .ui-nav-disclosure > summary::after { content: '+'; position: static; transform: none; font-size: 20px; color: var(--ui-brand); }
    body .ui-nav-disclosure[open] > summary::after { content: '−'; }
    body :is(.ac-nav,.op-nav) .ui-nav-disclosure ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: auto; overflow: visible; padding: 12px; margin: 0; gap: 12px; border-top: 1px solid var(--ui-line); }
    body .ui-admin-layout .op-nav li { display: grid; align-content: start; gap: 4px; }
    body .ui-admin-layout .op-nav-group { display: block; }
    body :is(.ac-nav,.op-nav) .ui-nav-disclosure a { width: 100%; min-height: 44px; white-space: normal; padding: 12px; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) { display: block; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) colgroup { display: none; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) thead { position: absolute; width: 1px; height: 1px; overflow: clip; clip-path: inset(50%); }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody { display: block; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px 20px; padding: 20px 16px; border-bottom: 1px solid var(--ui-line); }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody :is(td,th) { display: block; border: 0; padding: 0; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody :is(td,th)::before { content: attr(data-label); display: block; color: var(--ui-muted); font-size: 12px; margin-bottom: 4px; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody :is(td:first-child,td:last-child,.ui-cell-full) { grid-column: 1 / -1; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody tr:last-child { border-bottom: 0; }
    /* 목록으로 바뀐 표에서 caption 이 표 설명 칸으로 남으면 폭이 0 에 가까워 글자가 세로로 쪼개진다. */
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) caption { display: block; width: auto; padding: 0 0 8px; }
    body main#main-content table.ui-table-compact :is(th,td) { padding: 10px 8px; }
    body .ui-catalog .sk-grid { gap: 28px 20px; }
}
@media (max-width: 30rem) {
    body .ui-catalog .sk-grid { grid-template-columns: minmax(0,1fr); }
    body .ui-catalog .sk-head { padding-top: 0; }
    body .ui-catalog .sk-card-thumb { aspect-ratio: 16/9; }
    body main#main-content table.ui-adaptive-table:not(.ui-table-compact) tbody tr { column-gap: 16px; }
}
body main [hidden] { display: none !important; }

body .ui-nav-disclosure > summary:active { background: var(--ui-tint); }

body.rq-page--home .rq-demo-tabs, body .cm-tabs, body .hp-tabs .inner, body .hp-toc { flex-wrap: wrap; overflow: visible; }
body.rq-page--home .rq-demo-tabs button, body .cm-tabs a, body .hp-tabs a, body .hp-toc a { white-space: normal; max-width: 100%; min-height: 44px; }
body .hp-code code { white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 60rem) {
    body.skills-admin-page .skills-admin .ska-table { max-height: min(60svh, 520px); overflow: auto; }
    body.skills-admin-page .subpage-text-area { padding-bottom: 0; }
    body .hp-tabs .inner { gap: 0; padding-inline: 16px; }
    body .hp-tabs a { padding: 12px 8px; }
    body.rq-page--home .rq-demo-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

body .ui-table-frame:focus-visible { outline: 3px solid var(--ui-brand); outline-offset: 3px; }

/* 2026-10-29 정밀 검사 보완: 본문 보조 글자는 12px 아래로 줄이지 않는다(클래스로 크기를 정한 small 은 그대로). */
body main small { font-size: max(12px, .8333em); }
/* skills.css 의 .sk-table--stack 은 560px 이하에서 표를 쌓는다. main#main-content 가 없는 화면(판매자 등)도 caption 을 블록으로 둔다. */
/* 좁은 화면의 계정 레이아웃은 block 으로 흘러 grid 간격이 없다. 접이식 계정 메뉴와 제목이 붙지 않게 한다. */
@media (max-width: 60rem) {
    body .ui-account-layout > .ac-nav { margin-bottom: 24px; }
}
@media (max-width: 560px) {
    body table.sk-table--stack caption { display: block; width: auto; padding: 12px 14px 4px; text-align: left; }
}