/* Skills 구매자·판매자 화면. 전체상품(product-catalog.css)과 같은 색·테두리·간격을 쓴다. */
.skills-page, .skills-admin, .sk-dialog { --sk-ink:#17203a; --sk-blue:#344cdb; --sk-blue-deep:#263fae; --sk-line:#e1e6f0; --sk-line-soft:#edf0f6; --sk-field:#c3cce0; --sk-muted:#536077; --sk-soft:#f6f8fc; --sk-tint:#f1f4ff; --sk-good:#147a52; --sk-bad:#a12627; --sk-radius:14px; --sk-shadow:0 1px 2px rgba(23,32,58,.05); --sk-shadow-up:0 10px 24px -14px rgba(23,32,58,.28); --sk-mono:"Roboto Mono",Consolas,"Noto Sans KR",monospace; }
.skills-page, .skills-admin, .sk-dialog {
	--sk-arrow:#9aade4;
	--sk-white:#fff;
	--sk-dash:#b9c6ee;
	--sk-edge:#cbd5f6;
	--sk-text:#33405c;
	--sk-bad-soft:#fdf3f3;
	--sk-good-soft:#e9f6ef;
	--sk-hot:#7a5200;
}
.skills-page { color:var(--sk-ink); max-width:1200px; margin:32px auto 64px; padding:0 24px; font-size:14px; line-height:1.6; }
.skills-page *, .skills-page *::before, .skills-page *::after { box-sizing:border-box; }
/* :where 로 우선순위를 클래스 하나 수준에 맞춘다. 아래 부품 규칙(.sk-note--ai·.sk-terms 등)의 여백이 초기화에 눌리지 않게 한다. */
.skills-page :where(h1,h2,h3,p,ul,ol,dl,dd) { margin:0; padding:0; }
.skills-page ul { list-style:none; }
.skills-page a { color:var(--sk-blue-deep); }
.skills-page :is(button,a,input,select,textarea,summary):focus-visible { outline:3px solid var(--sk-blue); outline-offset:2px; }
.skills-page [hidden] { display:none !important; }

.sk-crumb { color:#59667b; font-size:13px; margin-bottom:8px; overflow-wrap:anywhere; }
/* 줄 높이는 그대로 두고 눌리는 영역만 44px 로 넓힌다. */
.sk-crumb a, .sk-note a, .sk-help a { padding:13px 0; }
.sk-crumb a { color:#59667b; text-decoration:none; }
.sk-crumb a:hover { color:var(--sk-blue-deep); text-decoration:underline; }
.sk-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; }
.sk-head h1 { font-size:clamp(22px,2.6vw,32px); line-height:1.3; letter-spacing:-.04em; font-weight:800; overflow-wrap:anywhere; }
.sk-head p { color:var(--sk-muted); margin-top:6px; font-size:15px; overflow-wrap:anywhere; }
.sk-head-actions { display:flex; flex-wrap:wrap; gap:8px; flex-shrink:0; }

.sk-btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 18px; border-radius:10px; border:1px solid var(--sk-blue); background:var(--sk-blue); color:#fff !important; font-weight:700; font-size:14px; cursor:pointer; text-decoration:none; transition:background-color .15s, border-color .15s; }
.sk-btn:hover { background:var(--sk-blue-deep); border-color:var(--sk-blue-deep); }
.sk-btn:disabled { opacity:.55; cursor:not-allowed; }
.sk-btn--ghost { background:#fff; color:var(--sk-blue-deep) !important; border-color:var(--sk-field); }
.sk-btn--ghost:hover { background:var(--sk-tint); border-color:#9aade4; }
.sk-btn--danger { background:#fff; color:var(--sk-bad) !important; border-color:#e2b4b4; }
.sk-btn--danger:hover { background:#fdf3f3; border-color:#d49a9a; }
.sk-btn--small { min-height:44px; padding:6px 14px; font-size:13px; font-weight:600; }

.sk-search { display:flex; gap:8px; }
.sk-search input { flex:1; min-width:0; height:48px; padding:0 16px; border:1px solid var(--sk-field); border-radius:12px; background:#fff; font-size:16px; color:var(--sk-ink); box-shadow:var(--sk-shadow); transition:border-color .15s; }
.sk-search input:hover, .sk-search input:focus { border-color:var(--sk-blue); }
.sk-search .sk-btn { min-height:48px; padding:8px 22px; border-radius:12px; }
.sk-chips { display:flex; flex-wrap:wrap; gap:6px; margin:12px 0 18px; }
.sk-chip { display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; padding:6px 16px; border:1px solid var(--sk-line); border-radius:22px; background:#fff; color:#34437c !important; font-size:13px; text-decoration:none; transition:background-color .15s, border-color .15s; }
.sk-chip:hover { background:var(--sk-tint); border-color:#b9c6ee; }
.sk-chip.is-on { background:var(--sk-ink); border-color:var(--sk-ink); color:#fff !important; font-weight:700; }

.sk-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
/* 카드 전체가 링크다. 눌리는 영역이 카드 크기와 같다. */
.sk-card { display:flex; flex-direction:column; min-width:0; height:100%; padding:18px; border:1px solid var(--sk-line); border-radius:var(--sk-radius); background:#fff; box-shadow:var(--sk-shadow); color:var(--sk-ink) !important; text-decoration:none; transition:border-color .15s, box-shadow .15s, transform .15s; }
.sk-card:hover { border-color:#9aade4; box-shadow:var(--sk-shadow-up); transform:translateY(-2px); }
.sk-card-top { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:10px; }
.sk-tag { display:inline-flex; align-items:center; padding:2px 8px; border-radius:6px; background:#eef2ff; color:#34437c; font-size:12px; font-weight:600; white-space:nowrap; }
.sk-tag:empty { display:none; }
.sk-tag--ai { background:#fff4d6; color:#7a5200; }
.sk-tag--state { background:#e9f6ef; color:var(--sk-good); }
.sk-tag--wait { background:#fff4d6; color:#7a5200; }
.sk-tag--bad { background:#fdeeee; color:var(--sk-bad); }
.sk-tag--plain { background:var(--sk-soft); color:var(--sk-muted); }
.sk-card h2 { font-size:17px; font-weight:750; line-height:1.4; letter-spacing:-.02em; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.sk-card p { color:var(--sk-muted); font-size:13px; margin:6px 0 14px; overflow-wrap:anywhere; word-break:keep-all; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.sk-card-foot { margin-top:auto; padding-top:12px; border-top:1px solid var(--sk-line-soft); display:flex; justify-content:space-between; gap:8px; align-items:baseline; font-size:12px; color:#59667b; }
.sk-card-foot strong { font-size:17px; font-weight:800; color:var(--sk-blue-deep); white-space:nowrap; }
.sk-card-foot strong small { font-size:12px; font-weight:500; color:#59667b; margin-left:2px; }
.sk-card-foot span { flex:0 0 auto; max-width:45%; min-width:0; overflow-wrap:anywhere; text-align:right; }
/* 사용량 과금처럼 금액 대신 규칙을 적은 긴 가격 문구는 카드 폭 안에서 줄바꿈한다. */
.sk-card-foot strong.sk-card-price--text { flex:1 1 auto; min-width:0; font-size:13px; font-weight:700; line-height:1.5; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; }
.sk-empty { padding:32px 16px; text-align:center; background:var(--sk-soft); border:1px dashed #c3cce0; border-radius:var(--sk-radius); color:var(--sk-muted); }
.sk-more { display:flex; justify-content:center; margin-top:16px; }

.sk-layout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:16px; align-items:start; }
.sk-visual-samples { margin-bottom:14px; }
.sk-visual-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }
.sk-visual-card { min-width:0; margin:0; border:1px solid var(--sk-line); border-radius:10px; overflow:hidden; background:var(--sk-soft); }
.sk-visual-open { display:flex; min-height:44px; align-items:center; justify-content:center; }
.sk-visual-card img,.sk-visual-card video { display:block; width:100%; height:auto; max-height:420px; object-fit:contain; background:#f5f7fb; }
.sk-visual-card figcaption { padding:10px 12px; font-size:13px; overflow-wrap:anywhere; }
.sk-visual-card figcaption small { display:block; margin-top:4px; }
.sk-visual-card figcaption a { display:inline-flex; align-items:center; min-height:44px; }
@media(max-width:600px) { .sk-visual-grid { grid-template-columns:minmax(0,1fr); gap:10px; } .sk-visual-card img,.sk-visual-card video { max-height:360px; } }

/* 이 스킬이 하는 일: 넣는 것 → 하는 일 → 받는 것. 칸 사이 화살표는 넓은 화면에선 오른쪽, 좁은 화면에선 아래를 가리킨다. */
.sk-show { margin-bottom:14px; }
.sk-flow { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr) minmax(0,1fr); gap:28px; list-style:none; }
.sk-flow-step { position:relative; min-width:0; padding:14px 16px; border:1px solid var(--sk-line); border-radius:12px; background:var(--sk-soft); }
.sk-flow-step + .sk-flow-step::before { content:""; position:absolute; left:-21px; top:50%; width:12px; height:12px; border-top:3px solid var(--sk-arrow); border-right:3px solid var(--sk-arrow); transform:translateY(-50%) rotate(45deg); }
.sk-flow-step--do { background:var(--sk-white); border-style:dashed; border-color:var(--sk-dash); }
.sk-flow-step--out { background:var(--sk-tint); border-color:var(--sk-edge); }
.sk-flow-name { font-size:12px; font-weight:700; color:var(--sk-muted); margin-bottom:2px; }
.sk-flow-step > strong { display:block; font-size:15px; font-weight:750; line-height:1.4; overflow-wrap:anywhere; word-break:keep-all; }
.sk-flow-step--do ul { display:grid; gap:6px; margin-top:4px; }
.sk-flow-step--do li { position:relative; padding-left:14px; font-size:13px; color:var(--sk-text); overflow-wrap:anywhere; word-break:keep-all; }
.sk-flow-step--do li::before { content:""; position:absolute; left:2px; top:.62em; width:5px; height:5px; border-radius:50%; background:var(--sk-blue); }
.sk-flow-peek { margin:8px 0 0; padding:8px 10px; border:1px solid var(--sk-line); border-radius:8px; background:var(--sk-white); font-family:var(--sk-mono); font-size:12px; line-height:1.55; color:var(--sk-text); white-space:pre-wrap; overflow-wrap:anywhere; }
.sk-flow-step--out .sk-flow-peek { border-color:var(--sk-edge); color:var(--sk-ink); }
.sk-uses { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.sk-uses li { padding:10px 12px; border:1px solid var(--sk-line); border-radius:10px; background:var(--sk-white); font-size:13px; color:var(--sk-text); overflow-wrap:anywhere; word-break:keep-all; }

/* 실제 결과물 */
.sk-show-result { margin-bottom:14px; }
.sk-show-lead { margin-top:14px; }
.sk-show-result .sk-visual-grid + .sk-show-lead { padding-top:12px; border-top:1px solid var(--sk-line-soft); }
.sk-show-block { margin-top:14px; min-width:0; }
.sk-show-block > h3, .sk-show-block .sk-schema-head h3 { margin:0 0 6px; font-size:14px; color:var(--sk-ink); }
.sk-show-block .sk-schema-head { margin-bottom:4px; }
.sk-show-block .sk-schema-head h3 { margin:0; }
.sk-show-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.sk-show-stats li { min-width:0; padding:10px 12px; border:1px solid var(--sk-line); border-radius:10px; background:var(--sk-white); }
.sk-show-stats span { display:block; color:var(--sk-muted); font-size:12px; overflow-wrap:anywhere; }
.sk-show-stats strong { display:block; font-size:17px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.sk-show-text { color:var(--sk-text); white-space:pre-wrap; overflow-wrap:anywhere; }
.sk-show-pre { max-height:280px; }
.sk-show-chips { display:flex; flex-wrap:wrap; gap:6px; }
.sk-show-chips li { max-width:100%; padding:4px 10px; border:1px solid var(--sk-line); border-radius:999px; background:var(--sk-white); font-size:13px; color:var(--sk-text); overflow-wrap:anywhere; }
.sk-show-cards { display:grid; gap:10px; list-style:none; }
.sk-show-card { min-width:0; padding:12px 14px; border:1px solid var(--sk-line); border-radius:12px; background:var(--sk-white); }
.sk-show-card-head { display:flex; align-items:baseline; gap:8px; }
.sk-show-card-head strong { flex:1 1 auto; min-width:0; font-size:14px; font-weight:750; line-height:1.45; overflow-wrap:anywhere; word-break:keep-all; }
.sk-show-card-head .sk-tag { flex:0 0 auto; }
.sk-show-card > * + * { margin-top:6px; }
.sk-show-quote { margin:6px 0 0; padding:6px 10px; border-left:3px solid var(--sk-edge); background:var(--sk-soft); font-size:13px; color:var(--sk-text); overflow-wrap:anywhere; }
.sk-show-quote span { display:block; font-size:12px; font-weight:700; color:var(--sk-muted); }
.sk-show-why { padding-top:6px; border-top:1px solid var(--sk-line-soft); }
.sk-show-bars { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 16px; }
.sk-show-bars li { display:grid; grid-template-columns:minmax(0,9em) minmax(0,1fr) 2.2em; align-items:center; gap:8px; font-size:12px; color:var(--sk-muted); }
.sk-show-bars b { font-weight:700; color:var(--sk-ink); text-align:right; font-variant-numeric:tabular-nums; }
.sk-meter { display:block; width:100%; height:6px; }
.sk-meter-bg { fill:var(--sk-line-soft); }
.sk-meter-fill { fill:var(--sk-blue); }
.sk-diff { display:grid; gap:10px; list-style:none; }
.sk-diff > li { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:6px 10px; }
.sk-diff > li > .sk-note { grid-column:1 / -1; margin-top:-2px; font-size:12px; }
.sk-diff-before, .sk-diff-after { min-width:0; padding:8px 10px; border-radius:8px; font-size:13px; overflow-wrap:anywhere; }
.sk-diff-before { background:var(--sk-bad-soft); color:var(--sk-text); }
.sk-diff-after { background:var(--sk-good-soft); color:var(--sk-ink); }
.sk-diff-tag { display:block; font-size:12px; font-weight:700; }
.sk-diff-before .sk-diff-tag { color:var(--sk-bad); }
.sk-diff-after .sk-diff-tag { color:var(--sk-good); }
.sk-gantt ul { display:grid; gap:4px; list-style:none; }
.sk-gantt-axis, .sk-gantt-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); align-items:center; gap:10px; }
.sk-gantt-ends { display:flex; justify-content:space-between; font-size:12px; color:var(--sk-muted); font-variant-numeric:tabular-nums; }
.sk-gantt-label { min-width:0; font-size:13px; color:var(--sk-text); overflow-wrap:anywhere; word-break:keep-all; }
.sk-gantt-row--hot .sk-gantt-label { font-weight:700; color:var(--sk-ink); }
.sk-gantt-row--hot:first-of-type, .sk-gantt-row:not(.sk-gantt-row--hot) + .sk-gantt-row--hot { margin-top:6px; padding-top:8px; border-top:1px dashed var(--sk-line); }
.sk-gantt-track { display:block; width:100%; height:14px; }
.sk-gantt-bg { fill:var(--sk-soft); }
.sk-gantt-bar--a { fill:var(--sk-blue); }
.sk-gantt-bar--b { fill:var(--sk-arrow); }
.sk-gantt-bar--hot { fill:var(--sk-hot); }
.sk-table--stack th { white-space:normal; }
.sk-swatches { display:flex; flex-wrap:wrap; gap:10px 16px; }
.sk-swatches li { display:flex; align-items:center; gap:8px; font-size:13px; }
.sk-swatches svg { flex:0 0 auto; border:1px solid var(--sk-line); border-radius:10px; }
.sk-swatches span { color:var(--sk-muted); }
.sk-show-files { display:flex; flex-wrap:wrap; gap:6px 14px; }
.sk-show-files li { display:flex; align-items:center; gap:6px; min-width:0; font-size:13px; overflow-wrap:anywhere; }
.sk-show-files small { color:var(--sk-muted); }
.sk-show-more { margin-top:14px; }
.sk-show-more > .sk-show-block:first-of-type { margin-top:4px; }
.sk-show-more > .sk-pre { margin-top:4px; }
.sk-example-fields { display:grid; gap:8px; margin:0 0 4px; }
.sk-example-fields > div { display:grid; grid-template-columns:minmax(0,9em) minmax(0,1fr); gap:10px; padding-bottom:8px; border-bottom:1px solid var(--sk-line-soft); }
.sk-example-fields dt { font-size:12px; font-weight:700; color:var(--sk-muted); overflow-wrap:anywhere; }
.sk-example-fields dd { min-width:0; font-size:13px; overflow-wrap:anywhere; }
.sk-example-value { margin:0; max-height:160px; overflow:auto; padding:6px 8px; border-radius:8px; background:var(--sk-soft); font-family:var(--sk-mono); font-size:12px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
@media(max-width:860px) {
 .sk-flow { grid-template-columns:minmax(0,1fr); gap:22px; }
 .sk-flow-step + .sk-flow-step::before { left:50%; top:-16px; transform:translateX(-50%) rotate(135deg); }
 .sk-uses { grid-template-columns:minmax(0,1fr); gap:6px; }
 .sk-show-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
}
@media(max-width:560px) {
 .sk-flow-step { padding:10px 12px; }
 .sk-show-stats li { padding:8px 10px; }
 .sk-show-stats strong { font-size:15px; }
 .sk-show-bars { grid-template-columns:minmax(0,1fr); }
 .sk-diff > li { grid-template-columns:minmax(0,1fr); gap:4px; }
 .sk-gantt-axis, .sk-gantt-row { grid-template-columns:minmax(0,1fr); gap:2px; }
 .sk-gantt-axis > span:first-child { display:none; }
 .sk-gantt-row { padding-bottom:4px; }
 .sk-example-fields > div { grid-template-columns:minmax(0,1fr); gap:2px; }
 /* 칸이 많은 표는 행마다 카드처럼 세로로 쌓고 칸 이름을 앞에 붙인다. */
 .sk-table--stack thead { display:none; }
 .sk-table--stack, .sk-table--stack tbody, .sk-table--stack tr, .sk-table--stack td { display:block; width:100%; }
 .sk-table--stack tr { padding:6px 0; border-bottom:1px solid var(--sk-line-soft); }
 .sk-table--stack tbody tr:last-child { border-bottom:0; }
 .sk-table--stack td { display:grid; grid-template-columns:minmax(0,5.5em) minmax(0,1fr); gap:8px; padding:2px 0; border-bottom:0; }
 .sk-table--stack td::before { content:attr(data-label); font-size:12px; font-weight:600; color:var(--sk-muted); }
}
.sk-panel { min-width:0; padding:20px; border:1px solid var(--sk-line); border-radius:var(--sk-radius); background:#fff; box-shadow:var(--sk-shadow); }
.sk-panel + .sk-panel { margin-top:14px; }
.sk-panel h2 { font-size:17px; font-weight:750; letter-spacing:-.02em; margin-bottom:12px; }
.sk-panel h3 { font-size:13px; font-weight:700; color:var(--sk-muted); margin:16px 0 6px; }
.sk-panel h2 + h3 { margin-top:0; }
.sk-panel-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; }
.sk-panel-head h2 { margin-bottom:0; }
.sk-panel--run { border-color:#cbd5f6; }
/* 실행 전 안내(예상 시간·요금 기준)는 한 덩어리로 묶어 입력 칸과 구분한다. */
.sk-run-info { margin:-4px 0 14px; padding:8px 12px; border-radius:10px; background:var(--sk-soft); }
.sk-run-info .sk-note { font-size:12px; }
.sk-run-info #sk-execution-info { color:var(--sk-ink); font-size:13px; font-weight:600; }
.sk-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; color:var(--sk-muted); font-size:13px; }
.sk-meta span { padding:3px 10px; border:1px solid var(--sk-line-soft); border-radius:999px; background:var(--sk-soft); }
.sk-meta strong { color:var(--sk-ink); }
.sk-price { font-size:22px; font-weight:800; color:var(--sk-blue-deep); white-space:nowrap; }
.sk-price small { font-size:12px; font-weight:500; color:var(--sk-muted); margin-left:3px; }
.sk-note { color:var(--sk-muted); font-size:13px; overflow-wrap:anywhere; }
.sk-note--ai { margin-top:14px; padding:10px 12px; border-radius:10px; background:#fff8e6; color:#6b4a00; }
.sk-desc { white-space:pre-wrap; overflow-wrap:anywhere; color:#33405c; }

.sk-field { margin-bottom:12px; min-width:0; }
.sk-field > label, .sk-label { display:flex; justify-content:space-between; align-items:baseline; gap:8px; font-size:13px; font-weight:700; margin-bottom:5px; overflow-wrap:anywhere; }
.sk-field > label small, .sk-label small { color:#647089; font-weight:400; text-align:right; }
.sk-field > label small.sk-key { font-family:var(--sk-mono); font-size:12px; }
.sk-field :is(input[type=text],input[type=number],input[type=url],input[type=password],select,textarea) { width:100%; min-height:44px; padding:9px 12px; border:1px solid var(--sk-field); border-radius:10px; background:#fff; font-size:16px; color:var(--sk-ink); transition:border-color .15s; }
.sk-field :is(input,select,textarea):hover, .sk-field :is(input,select,textarea):focus { border-color:var(--sk-blue); }
.sk-field :is(input,textarea)::placeholder, .sk-search input::placeholder { color:#8e99b0; }
.sk-field textarea { min-height:88px; resize:vertical; line-height:1.5; }
.sk-field textarea.sk-code { font-family:var(--sk-mono); font-size:13px; min-height:132px; white-space:pre-wrap; overflow-wrap:anywhere; overflow:auto; background:#fbfcfe; }
.sk-field .sk-help { color:#647089; font-size:12px; margin-top:4px; overflow-wrap:anywhere; }
.sk-check { display:flex; align-items:center; gap:8px; min-height:44px; font-size:14px; cursor:pointer; }
.sk-check input { width:20px; height:20px; accent-color:var(--sk-blue); flex-shrink:0; }
.sk-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.sk-actions { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; margin-top:12px; }
.sk-actions .sk-note { flex:1 1 180px; }
.sk-toggle { background:none; border:0; padding:0 4px; min-height:44px; min-width:44px; color:var(--sk-blue-deep); text-decoration:underline; text-underline-offset:3px; font-size:13px; cursor:pointer; }
.sk-row--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.sk-choices { display:grid; gap:6px; }

/* 여러 건을 받는 입력: 항목을 하나씩 추가한다. */
.sk-rep-list { display:flex; flex-direction:column; gap:8px; }
.sk-rep-item { min-width:0; padding:8px 12px 12px; border:1px solid var(--sk-line); border-radius:12px; background:var(--sk-soft); }
.sk-rep-item .sk-field { margin-bottom:0; }
.sk-rep-no, .sk-out-no { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; min-width:24px; height:24px; padding:0 6px; border-radius:12px; background:var(--sk-tint); color:var(--sk-blue-deep); font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; }
.sk-rep-head { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.sk-rep-head .sk-rep-remove { margin-left:auto; padding:6px 12px; }
.sk-rep-head .sk-field--inline { display:flex; align-items:center; gap:8px; flex:0 1 240px; min-width:0; }
.sk-rep-head .sk-field--inline > label { margin:0; font-size:12px; font-weight:600; color:var(--sk-muted); white-space:nowrap; }
.sk-rep-head .sk-field--inline > input { flex:1 1 80px; width:auto; min-width:0; font-family:var(--sk-mono); font-size:14px; }
.sk-rep-body { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 10px; }
.sk-rep-body :is(.sk-field--wide,.sk-check) { grid-column:1 / -1; }
.sk-rep-body .sk-field > label { margin-bottom:3px; font-size:12px; font-weight:600; color:var(--sk-muted); }
.sk-rep-body textarea { min-height:72px; }
.sk-rep-foot { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin-top:8px; }
.sk-field > .sk-rep[aria-invalid="true"] .sk-rep-foot .sk-btn { border-color:#a12627; }

/* 판매자 편집: 샘플 고르기, 항목 편집기, 파일 올리기, 참고 자료·단계 */
.sk-sample { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:12px 20px; align-items:end; margin-bottom:14px; background:var(--sk-tint); border-color:#cbd5f6; }
.sk-sample h2 { margin-bottom:4px; }
.sk-schema { margin-top:12px; padding-top:12px; border-top:1px solid var(--sk-line-soft); }
.sk-schema-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 12px; }
.sk-schema-head h3 { margin:0; font-size:14px; color:var(--sk-ink); }
.sk-schema-head h3 small, .sk-more-options summary small { color:#647089; font-weight:400; margin-left:4px; }
.sk-brows { display:flex; flex-direction:column; gap:6px; margin:6px 0 8px; }
.sk-brow { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr) minmax(0,1.9fr) minmax(0,1.4fr) minmax(0,.8fr) 64px 62px; gap:6px; align-items:center; min-width:0; }
.sk-brow-head { margin-top:8px; padding:0 2px; color:var(--sk-muted); font-size:12px; font-weight:600; }
.sk-builder:has(.sk-brows:empty) .sk-brow-head { display:none; }
.sk-brow .sk-btn { min-width:44px; padding-left:8px; padding-right:8px; }
/* 실행 방식은 고른 것이 한눈에 보이게 칸으로 나눈다. */
.sk-check:has(> input[name="skill_type"]) { align-items:flex-start; gap:10px; margin-top:8px; padding:10px 12px; border:1px solid var(--sk-line); border-radius:12px; background:#fff; transition:border-color .15s, background-color .15s; }
.sk-check:has(> input[name="skill_type"]):hover { border-color:#9aade4; }
.sk-check:has(> input[name="skill_type"]:checked) { border-color:var(--sk-blue); background:var(--sk-tint); }
.sk-check:has(> input[name="skill_type"]) > input { margin-top:2px; }
.sk-check:has(> input[name="skill_type"]) > span { min-width:0; overflow-wrap:anywhere; }
.sk-brow :is(input[type=text],input[type=number],select), .sk-ref :is(input[type=text],textarea,select) { width:100%; min-width:0; min-height:44px; padding:9px 10px; border:1px solid var(--sk-field); border-radius:10px; background:#fff; font-size:16px; color:var(--sk-ink); }
.sk-brow :is(input,select):hover, .sk-brow :is(input,select):focus, .sk-ref :is(input,textarea):hover, .sk-ref :is(input,textarea):focus { border-color:var(--sk-blue); }
.sk-brow :is(input,select)::placeholder, .sk-ref :is(input,textarea)::placeholder { color:#8e99b0; }
.sk-brow .sk-b-name { font-family:var(--sk-mono); font-size:14px; }
/* 문자열이 아닌 항목은 선택지·최대 글자 칸이 없다. 설명 칸이 그 자리를 채운다. */
.sk-brow:has(.sk-b-enum[hidden]) .sk-b-desc { grid-column:3 / 6; }
.sk-sub { margin-top:14px; padding-top:12px; border-top:1px solid var(--sk-line-soft); }
.sk-sub .sk-help, .sk-more-options > .sk-help { color:#647089; font-size:12px; margin:4px 0 8px; overflow-wrap:anywhere; }
.sk-refs { display:flex; flex-direction:column; gap:8px; }
.sk-ref { min-width:0; padding:10px; border:1px solid var(--sk-line); border-radius:12px; background:var(--sk-soft); }
.sk-ref-head { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; }
.sk-ref-head :is(.sk-ref-name,.sk-step-name,.sk-file-path) { flex:1 1 180px; }
.sk-ref-head select { flex:0 1 150px; width:auto; }
.sk-step-code { display:flex; flex-wrap:wrap; gap:6px 10px; margin-top:6px; }
.sk-step-code select { flex:1 1 180px; }
.sk-ref > .sk-help { color:#647089; font-size:12px; margin:6px 0 0; overflow-wrap:anywhere; }
/* 줄글 안의 링크(클래스가 없는 링크만): 글 흐름은 그대로 두고 누르는 영역만 넓힌다(44px). 카드·버튼 링크는 대상이 아니다. */
.skills-page :is(p,li,td,dd,span) > a:not([class]) { display:inline-block; max-width:100%; padding:13px 12px; margin:-13px -12px; overflow-wrap:anywhere; }
.sk-ref-size { white-space:nowrap; }
.sk-ref details > summary, .sk-more-options > summary { display:flex; align-items:center; min-height:44px; cursor:pointer; color:var(--sk-blue-deep); font-size:13px; }
.sk-ref textarea { margin-top:6px; min-height:140px; resize:vertical; line-height:1.5; font-family:var(--sk-mono); font-size:13px; white-space:pre-wrap; }
/* summary 를 flex 로 쓰면 기본 삼각형이 사라진다. 펼침 표시를 직접 그린다. */
:is(.sk-ref details, .sk-more-options, .sk-sample-card details, .sk-out-section) > summary { list-style:none; }
:is(.sk-ref details, .sk-more-options, .sk-sample-card details, .sk-out-section) > summary::-webkit-details-marker { display:none; }
:is(.sk-ref details, .sk-more-options, .sk-sample-card details, .sk-out-section) > summary::after { content:""; flex-shrink:0; width:8px; height:8px; margin:0 4px 3px 8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); transition:transform .15s; opacity:.7; }
:is(.sk-ref details, .sk-more-options, .sk-sample-card details, .sk-out-section)[open] > summary::after { margin-bottom:-3px; transform:rotate(-135deg); }
details:is(.sk-more-options, .sk-out-section) > summary::after { margin-left:auto; }
.sk-more-options { margin-top:10px; padding:0 12px; border:1px solid var(--sk-line); border-radius:12px; }
.sk-more-options[open] { padding-bottom:12px; }
.sk-more-options > summary { gap:0 4px; font-weight:700; font-size:14px; color:var(--sk-ink); overflow-wrap:anywhere; }
.sk-more-options > summary small { flex:1 1 0; min-width:0; }
.sk-more-options:not([open]):hover { border-color:#9aade4; }
.sk-uploads { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px; }
.sk-uploads .sk-help { flex:1 1 220px; margin-top:0; }
.sk-upload { position:relative; overflow:hidden; }
.sk-upload input[type=file] { position:absolute; inset:-1px; width:calc(100% + 2px); height:calc(100% + 2px); opacity:0; cursor:pointer; font-size:0; }
.sk-upload:focus-within { outline:3px solid var(--sk-blue); outline-offset:2px; }
.sk-chips--tight { margin:6px 0 0; }
.sk-chips--tight .sk-chip { font-family:var(--sk-mono); cursor:pointer; }

/* 끌어다 놓기와 제출 전 확인 */
.sk-steps.is-drop { outline:3px dashed var(--sk-blue); outline-offset:6px; border-radius:var(--sk-radius); }
.sk-sample .sk-uploads { margin-top:10px; }
.sk-checkpanel { background:var(--sk-soft); }
.sk-checkpanel h2 { margin-bottom:0; }
.sk-checkpanel > .sk-schema-head { margin-bottom:8px; }
.sk-checklist { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 16px; font-size:13px; }
.sk-checklist li { display:flex; flex-wrap:wrap; gap:2px 8px; min-width:0; overflow-wrap:anywhere; }
.sk-checklist li.is-ok strong { color:var(--sk-good); font-weight:600; }
.sk-checklist li.is-todo strong { color:var(--sk-ink); }
.sk-checklist li span { color:var(--sk-muted); }

/* 제작 가이드 */
.sk-guide { display:grid; grid-template-columns:220px minmax(0,1fr); gap:20px; align-items:start; }
.sk-guide-nav { position:sticky; top:150px; max-height:calc(100vh - 166px); overflow-y:auto; overscroll-behavior:contain; padding:12px; border:1px solid var(--sk-line); border-radius:var(--sk-radius); background:#fff; }
.sk-guide-nav a { display:flex; align-items:center; min-height:44px; padding:4px 8px; border-radius:8px; color:var(--sk-ink); text-decoration:none; font-size:13px; }
.sk-guide-nav a:hover { background:var(--sk-tint); color:var(--sk-blue-deep); }
.sk-guide-body .sk-panel { scroll-margin-top:150px; }
.sk-guide-body .sk-panel > p, .sk-guide-body .sk-panel > ul, .sk-guide-body .sk-panel > ol { margin-bottom:10px; color:#33405c; overflow-wrap:anywhere; }
.sk-guide-body .sk-panel > :is(ul,ol) { padding-left:20px; }
.sk-guide-body .sk-panel > ul { list-style:disc; }
.sk-guide-body .sk-panel > ol { list-style:decimal; }
.sk-guide-body .sk-panel li { margin-bottom:4px; }
.sk-guide-body .sk-pre { margin-bottom:10px; max-height:420px; }
.sk-guide-body code { color:#33405c; padding:1px 5px; border-radius:5px; background:var(--sk-soft); font-family:var(--sk-mono); font-size:12px; overflow-wrap:anywhere; }
.sk-guide-body .sk-pre code { padding:0; background:none; color:inherit; }
.sk-sample-card { padding:14px; border:1px solid var(--sk-line); border-radius:12px; }
.sk-sample-card + .sk-sample-card { margin-top:10px; }
.sk-sample-card h3 { margin:0 0 4px; font-size:15px; color:var(--sk-ink); }
.sk-sample-card .sk-card-top { margin-bottom:6px; }
.sk-sample-card details > summary { display:flex; align-items:center; min-height:44px; cursor:pointer; color:var(--sk-blue-deep); font-size:13px; }

.sk-alert { margin-top:12px; padding:10px 12px; border-radius:10px; background:var(--sk-soft); color:var(--sk-muted); font-size:13px; overflow-wrap:anywhere; }
.skills-page > .sk-alert:first-child { margin:0 0 10px; }
.sk-alert--error { background:#fdeeee; color:var(--sk-bad); }
.sk-alert--ok { background:#e9f6ef; color:#0f5c3e; }
.sk-alert--info { background:#eef2ff; color:#2a3a8f; }
.sk-result { margin-top:16px; padding:14px; border-radius:12px; background:var(--sk-soft); border:1px solid var(--sk-line-soft); scroll-margin-top:150px; }
.sk-result-head { display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center; justify-content:space-between; margin-bottom:10px; font-size:13px; }
.sk-result-head strong { font-size:15px; }
.sk-kv { display:grid; grid-template-columns:minmax(0,34%) minmax(0,1fr); gap:1px; background:var(--sk-line-soft); border:1px solid var(--sk-line-soft); border-radius:10px; overflow:hidden; font-size:13px; }
.sk-kv > :is(dt,dd) { background:#fff; padding:8px 10px; overflow-wrap:anywhere; min-width:0; }
.sk-kv > dt { background:#f9fafc; font-weight:700; color:#33405c; }
.sk-rich-output { min-width:0; overflow-wrap:anywhere; font-size:13px; line-height:1.55; }
/* 구조화 결과: 짧은 값은 이름 옆에, 긴 값과 목록은 이름 아래에 둔다. 맨 위 묶음은 접을 수 있는 구역이다. */
.sk-out { display:flex; flex-direction:column; gap:8px; min-width:0; font-size:13px; line-height:1.55; overflow-wrap:anywhere; }
.sk-out > .sk-out-kv { padding:10px 12px; border:1px solid var(--sk-line-soft); border-radius:10px; background:#fff; }
.sk-out-section { min-width:0; padding:0 12px; border:1px solid var(--sk-line-soft); border-radius:10px; background:#fff; }
.sk-out-section[open] { padding-bottom:12px; }
.sk-out-section > summary { display:flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; font-size:14px; font-weight:750; letter-spacing:-.01em; }
.sk-out-section > summary small { color:var(--sk-muted); font-size:12px; font-weight:500; }
.sk-out-kv { display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; min-width:0; }
.sk-out-row { flex:1 1 100%; display:grid; grid-template-columns:minmax(64px,28%) minmax(0,1fr); gap:10px; align-items:baseline; min-width:0; }
.sk-out-row > dt { color:var(--sk-muted); font-size:12px; font-weight:600; overflow-wrap:anywhere; }
.sk-out-row > dd { min-width:0; margin:0; padding:0; }
.sk-out-row--block { display:block; }
.sk-out-row--block > dt { margin-bottom:3px; }
.sk-out-row--block:has(> dd > :is(.sk-out-group,.sk-out-kv,.sk-out-check)) > dt { margin:4px 0 5px; color:#243b68; font-size:13px; font-weight:700; }
.sk-out-row--stat { flex:0 0 auto; display:inline-flex; gap:6px; padding:2px 10px; border:1px solid var(--sk-line-soft); border-radius:999px; background:var(--sk-soft); }
.sk-out-row--stat > dd { font-weight:700; font-variant-numeric:tabular-nums; }
.sk-out-text { white-space:pre-wrap; margin:0; overflow-wrap:anywhere; }
.sk-out-row--none > dd { color:var(--sk-muted); }
.sk-out-inline { display:flex; flex-wrap:wrap; gap:2px 14px; margin:0; padding:0; min-width:0; min-height:24px; align-items:center; }
.sk-out-inline > div { display:flex; align-items:baseline; gap:6px; min-width:0; }
.sk-out-inline dt { color:var(--sk-muted); font-size:12px; font-weight:600; }
.sk-out-inline dd { margin:0; padding:0; overflow-wrap:anywhere; }
.sk-out-empty { color:var(--sk-muted); }
.sk-out-records { margin:0; padding:0; list-style:none; }
.sk-out-records > li { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; align-items:start; padding:8px 0; border-top:1px solid var(--sk-line-soft); min-width:0; }
.sk-out-records > li:first-child { padding-top:0; border-top:0; }
.sk-out-records > li:last-child { padding-bottom:0; }
.sk-out-no { background:var(--sk-soft); color:var(--sk-muted); }
.sk-out-list { margin:0; padding-left:22px; list-style:decimal; }
.sk-out-list > li { padding:2px 0; min-width:0; }
.sk-out-chips { display:flex; flex-wrap:wrap; gap:4px 6px; margin:0; padding:0; list-style:none; }
.sk-out-chips > li { padding:1px 9px; border:1px solid var(--sk-line-soft); border-radius:6px; background:var(--sk-soft); font-size:12px; }
.sk-out-check { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:24px; }
.sk-out-check > span:first-child { min-width:0; }
.sk-out-group > .sk-btn { margin-top:8px; }
.sk-rich-output .sk-btn { min-height:44px; margin-top:6px; }
.sk-pre { margin:0; padding:12px 14px; max-height:320px; overflow:auto; border-radius:10px; background:#0f172a; color:#e6ebf5; font-family:var(--sk-mono); font-size:12px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
/* 명령·코드·폴더 구조는 줄을 꺾지 않고 가로로 넘긴다. */
.sk-pre--code { white-space:pre; overflow-wrap:normal; }
.sk-table { width:100%; border-collapse:collapse; font-size:13px; table-layout:fixed; }
.sk-table :is(th,td) { padding:9px 8px; border-bottom:1px solid var(--sk-line-soft); text-align:left; vertical-align:top; overflow-wrap:anywhere; }
.sk-table th { padding:6px 8px; border-bottom-color:var(--sk-line); font-size:12px; font-weight:600; color:var(--sk-muted); }
.sk-table tbody tr:last-child td { border-bottom:0; }
.sk-table td:first-child { font-weight:600; }
.sk-table td.num, .sk-table th.num { text-align:right; white-space:nowrap; }
.sk-table td.num { font-variant-numeric:tabular-nums; }
.sk-table-note { margin-top:6px; }
.sk-io-name { display:flex; flex-wrap:wrap; align-items:center; gap:2px 6px; }
.sk-io-key { display:block; margin-top:1px; padding:0; background:none; color:#647089; font-family:var(--sk-mono); font-size:12px; font-weight:400; overflow-wrap:anywhere; }
.sk-tag--req { padding:0 6px; background:#fdeeee; color:var(--sk-bad); }
.sk-tiles { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.sk-tile { min-width:0; padding:14px 16px; border:1px solid var(--sk-line); border-radius:12px; background:#fff; box-shadow:var(--sk-shadow); }
.sk-tile span { display:block; color:var(--sk-muted); font-size:12px; }
.sk-tile strong { display:block; margin-top:2px; font-size:20px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.sk-tile--accent { background:var(--sk-tint); border-color:#cbd5f6; }
.sk-tile--accent strong { color:var(--sk-blue-deep); }
.sk-list { display:flex; flex-direction:column; gap:8px; }
.sk-item { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; justify-content:space-between; padding:14px 16px; border:1px solid var(--sk-line); border-radius:12px; background:#fff; box-shadow:var(--sk-shadow); min-width:0; }
.sk-item-main { min-width:0; flex:1 1 220px; }
.sk-item-main strong { display:block; font-size:15px; overflow-wrap:anywhere; }
.sk-item-main span { display:block; color:var(--sk-muted); font-size:12px; overflow-wrap:anywhere; }
.sk-item-side { display:flex; flex-wrap:wrap; gap:6px 8px; align-items:center; font-size:13px; }
.sk-steps { counter-reset:sk-step; }
.sk-steps > .sk-panel > :is(h2, .sk-panel-head > h2) { display:flex; align-items:center; gap:8px; }
.sk-steps > .sk-panel > :is(h2, .sk-panel-head > h2)::before { counter-increment:sk-step; content:counter(sk-step); display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:24px; height:24px; border-radius:50%; background:var(--sk-tint); color:var(--sk-blue-deep); font-size:13px; font-weight:800; }
.sk-example + .sk-example { margin-top:12px; padding-top:12px; border-top:1px solid var(--sk-line-soft); }
.sk-example-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.sk-example .sk-label { font-size:12px; color:var(--sk-muted); }
.sk-terms { padding-left:18px; list-style:disc !important; color:#33405c; font-size:13px; }
.sk-terms li { margin-bottom:6px; overflow-wrap:anywhere; }
.sk-payout { padding:12px 14px; border-radius:10px; background:var(--sk-tint); font-size:13px; overflow-wrap:anywhere; }
.sk-payout strong { color:var(--sk-blue-deep); }

/* 공용 부품: 대화상자, 칸 아래 오류, 주의 버튼 */
.sk-btn--warn { background:var(--sk-bad); border-color:var(--sk-bad); }
.sk-btn--warn:hover { background:#851f20; border-color:#851f20; }
.sk-dialog { width:min(440px, calc(100vw - 24px)); max-height:calc(100vh - 24px); padding:0; border:0; border-radius:16px; background:#fff; color:#17203a; box-shadow:0 24px 60px -20px rgba(23,32,58,.5); font-size:14px; line-height:1.6; overflow:auto; }
.sk-dialog::backdrop { background:rgba(15,23,42,.45); }
.sk-dialog *, .sk-dialog *::before, .sk-dialog *::after { box-sizing:border-box; }
.sk-dialog-form { padding:20px; }
.sk-dialog h2 { margin:0 0 8px; font-size:17px; font-weight:750; letter-spacing:-.02em; overflow-wrap:anywhere; }
.sk-dialog p { margin:0 0 6px; color:#33405c; overflow-wrap:anywhere; }
.sk-dialog .sk-field { margin:12px 0 0; }
.sk-dialog .sk-field > label { display:block; font-size:13px; font-weight:700; margin-bottom:5px; }
.sk-dialog .sk-field :is(input,textarea) { width:100%; min-height:44px; padding:9px 12px; border:1px solid #c3cce0; border-radius:10px; font-size:16px; color:#17203a; }
.sk-dialog .sk-field textarea { min-height:96px; resize:vertical; line-height:1.5; }
.sk-dialog .sk-actions { justify-content:flex-end; margin-top:16px; }
.sk-dialog :is(button,input,textarea):focus-visible { outline:3px solid #344cdb; outline-offset:2px; }
.sk-field-error { margin-top:4px; color:#a12627; font-size:12px; font-weight:600; overflow-wrap:anywhere; }
.sk-field :is(input,select,textarea)[aria-invalid="true"] { border-color:#a12627; background:#fffafa; }
.sk-required, abbr.sk-required[title] { color:#a12627; font-weight:700; text-decoration:none; border:0; cursor:help; }
.sk-banner { margin:0 0 12px; }
.sk-alert--action { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; }
.sk-alert--action > span { flex:1 1 200px; min-width:0; }

/* 판매자: 상태 이름표, 폼 아래 구획, 늘 보이는 저장 막대 */
.sk-item-main .sk-item-warn { color:var(--sk-bad); font-weight:600; }
.sk-tiles-note { margin:-4px 0 12px !important; }
.sk-note--gap { margin-top:10px !important; }
.sk-states { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px !important; }
.sk-states .sk-tag { font-size:13px; padding:3px 10px; }
.sk-panel--after { margin-top:14px; }
.sk-field--top { margin-top:8px; }
.sk-field textarea.sk-code--short { min-height:88px; }
.sk-pre--result { margin-top:8px; }
.sk-list--tight { margin:8px 0; }
.sk-actions--flush { margin-top:0; }
.sk-savebar { position:sticky; bottom:0; z-index:5; margin-top:14px; padding:10px 0 12px; background:rgba(255,255,255,.97); border-top:1px solid var(--sk-line); }
.sk-savebar .sk-alert { margin:0 0 8px; }
.sk-savebar .sk-actions { margin-top:0; }
.sk-savebar .sk-dirty { flex:1 1 160px; color:#7a5200; font-weight:600; }
.sk-savebar-links { display:inline-flex; flex-wrap:wrap; gap:0 8px; margin-left:auto; }
.sk-savebar-links:empty { display:none; }
.sk-savebar-toggle { display:none; }
.sk-link.sk-link--danger { color:var(--sk-bad); }
/* 고칠 수 없는 상태에서는 올리기 버튼도 눌리지 않는 모양으로 보인다. */
.sk-upload:has(input:disabled) { opacity:.55; cursor:not-allowed; }
.sk-upload:has(input:disabled) input { cursor:not-allowed; }

/* 구매자: 목록 개수·쪽 넘기기, 결과 보기, 실행 내역 */
.sk-count { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin:0 0 10px; color:var(--sk-muted); font-size:13px; }
.sk-count strong { color:var(--sk-ink); }
.sk-pager { gap:8px; }
.sk-empty-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:12px !important; }
.sk-empty--page { padding:48px 16px; }
.sk-empty--page h1 { font-size:20px; font-weight:800; color:var(--sk-ink); margin-bottom:8px; overflow-wrap:anywhere; }
.sk-result-head { justify-content:flex-start; }
.sk-result-state { margin-bottom:10px !important; font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.sk-result-view > .sk-kv { margin-bottom:0; }
.sk-kv .sk-kv { font-size:12px; }
.sk-result-text { white-space:pre-wrap; }
.sk-result-list { padding-left:18px !important; list-style:disc !important; }
.sk-result-list > li + li { margin-top:4px; }
.sk-result-code { font-family:var(--sk-mono); font-size:12px; overflow-wrap:anywhere; }
.sk-result-tools { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:10px; }
.sk-result .sk-pre { margin-top:0; }
.sk-item--run { align-items:flex-start; }
.sk-run-detail { flex:1 1 100%; min-width:0; padding-top:10px; border-top:1px solid var(--sk-line-soft); }
.sk-run-detail > .sk-note { margin-bottom:8px; }

/* 마우스로 쓰는 넓은 화면에서만 보조 버튼·분류를 낮춘다. 터치 화면은 44px 을 유지한다. */
/* 판매자 등록 단계, 유형 선택, 1원 인증, 출금 신청 */
.sk-join-steps { display:flex; gap:6px; margin:0 0 12px; font-size:13px; color:var(--sk-muted); }
.sk-join-steps li { display:flex; align-items:center; gap:6px; flex:1 1 0; min-width:0; padding:8px 10px; border:1px solid var(--sk-line); border-radius:10px; background:#fff; }
.sk-join-steps li strong { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:var(--sk-soft); font-size:12px; flex-shrink:0; }
.sk-join-steps li span { min-width:0; overflow-wrap:anywhere; }
.sk-join-steps li.is-on { border-color:#cbd5f6; background:var(--sk-tint); color:var(--sk-ink); font-weight:700; }
.sk-join-steps li.is-on strong { background:var(--sk-blue); color:#fff; }
.sk-join-steps li.is-done strong { background:#e9f6ef; color:var(--sk-good); }
.sk-seg { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px; padding:0; border:0; min-width:0; }
.sk-seg legend { width:100%; font-size:13px; font-weight:700; margin-bottom:5px; padding:0; }
.sk-seg label { flex:1 1 0; position:relative; min-width:0; cursor:pointer; }
.sk-seg input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.sk-seg span { display:flex; align-items:center; justify-content:center; min-height:44px; border:1px solid var(--sk-field); border-radius:10px; background:#fff; font-size:15px; font-weight:600; }
.sk-seg input:checked + span { border-color:var(--sk-blue); background:var(--sk-tint); color:var(--sk-blue-deep); }
.sk-seg input:focus-visible + span { outline:2px solid var(--sk-blue); outline-offset:2px; }
.sk-subpanel { margin-top:14px; padding-top:14px; border-top:1px solid var(--sk-line-soft); }
.sk-subpanel > h3:first-child { margin-top:0; }
.sk-verify, .sk-payform { display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr); gap:0 12px; align-items:end; margin-top:12px; }
.sk-verify .sk-actions, .sk-payform .sk-actions { margin:0 0 12px; }
.sk-verify input { letter-spacing:.3em; font-variant-numeric:tabular-nums; }
.sk-link { min-height:44px; min-width:44px; padding:0 6px; border:0; background:none; color:var(--sk-blue-deep); font-size:13px; text-decoration:underline; white-space:nowrap; cursor:pointer; }
#sk-pay-panel { margin-bottom:12px; }
.sk-consent { margin-top:4px; }
.sk-consent .sk-check { align-items:flex-start; padding:6px 0; }
.sk-consent .sk-check input { margin-top:2px; }
.sk-consent .sk-check span { min-width:0; overflow-wrap:anywhere; }
.sk-consent .sk-check small { color:var(--sk-bad); font-weight:600; }
.sk-consent .sk-check a { text-decoration:underline; }
.sk-consent > .sk-note { margin:2px 0 4px 28px; font-size:12px; }
.sk-panel--notice { margin-bottom:12px; border-color:#f0d58a; background:#fffaf0; }
.sk-terms-doc h3 { color:var(--sk-ink); font-size:14px; margin:14px 0 4px; }
.sk-terms-doc .sk-panel > h3:first-of-type { margin-top:0; }
.sk-terms-doc li ul { list-style:disc; padding-left:18px; margin-top:4px; }
.sk-terms-doc .sk-table td { font-weight:400; }
.sk-terms-doc .sk-table td:first-child { font-weight:600; }
.sk-table--payout td .sk-note { display:block; font-weight:400; }
@media(min-width:861px) and (hover:hover) and (pointer:fine) {
 .sk-chip { min-height:36px; }
 .sk-btn--small { min-height:38px; }
 .sk-guide-nav a { min-height:34px; }
 .sk-rep-head .sk-rep-remove { min-height:32px; }
 .sk-rep-head .sk-field--inline > input { min-height:34px; padding-top:4px; padding-bottom:4px; }
}
@media(prefers-reduced-motion:reduce) { .sk-card, .sk-btn, .sk-chip, .sk-check, summary::after { transition:none; } .sk-card:hover { transform:none; } }
@media(max-width:1000px) { .sk-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .sk-tiles { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:860px) {
 .sk-layout { grid-template-columns:minmax(0,1fr); gap:12px; }
 .sk-guide { grid-template-columns:minmax(0,1fr); gap:12px; }
 /* 목차는 한 줄로 두고 가로로 넘긴다. 긴 가이드에서 계속 쓸 수 있게 위에 붙인다. */
 .sk-guide-nav { position:sticky; top:calc(var(--sk-sticky-top,150px) + var(--notice-bar-height, 0px)); z-index:4; display:flex; flex-wrap:nowrap; gap:4px; max-height:none; padding:6px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:thin; box-shadow:var(--sk-shadow-up); }
 .sk-guide-nav a { flex:0 0 auto; padding:4px 12px; border:1px solid var(--sk-line-soft); border-radius:22px; white-space:nowrap; }
 .sk-guide-body .sk-panel { scroll-margin-top:calc(var(--sk-sticky-top,150px) + var(--notice-bar-height, 0px) + 64px); }
}
@media(max-width:760px) {
 .skills-page { margin-top:24px; margin-bottom:32px; padding:0 12px; --sk-sticky-top:112px; }
 .sk-head { display:block; margin-bottom:10px; }
 .sk-head p { font-size:14px; margin-top:4px; }
 .sk-head-actions { margin-top:8px; }
 .sk-crumb { margin-bottom:6px; font-size:12px; }
 .sk-search input, .sk-search .sk-btn { height:44px; min-height:44px; border-radius:10px; }
 .sk-search input { padding:0 12px; }
 .sk-search .sk-btn { padding:8px 16px; }
 .sk-chips { margin:8px 0 10px; gap:4px; }
 .sk-chip { padding:4px 11px; font-size:12px; }
 .sk-grid { gap:10px; }
 .sk-panel { padding:12px; }
 .sk-panel + .sk-panel { margin-top:10px; }
 .sk-panel h2 { font-size:16px; margin-bottom:8px; }
 .sk-panel-head { margin-bottom:8px; }
 .sk-sample { grid-template-columns:minmax(0,1fr); gap:8px; margin-bottom:10px; }
 .sk-brow { grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:8px; border:1px solid var(--sk-line); border-radius:10px; background:var(--sk-soft); }
 .sk-brow-head { display:none; }
 .sk-brow > .sk-btn { justify-self:end; }
 .sk-run-info { margin:-2px 0 10px; padding:6px 10px; }
 .sk-result { scroll-margin-top:110px; }
 .sk-out-section { padding:0 10px; }
 .sk-out-section[open] { padding-bottom:10px; }
 .sk-out > .sk-out-kv { padding:8px 10px; }
 .sk-rep-item { padding:6px 10px 10px; }
 .sk-brow .sk-b-desc, .sk-brow:has(.sk-b-enum[hidden]) .sk-b-desc { grid-column:1 / -1; }
 .sk-ref { padding:8px; }
 .sk-more-options { padding:0 10px; }
 /* 좁은 화면에서는 설명을 이름 아래로 내리고 펼침 표시는 오른쪽 위에 둔다. */
 .sk-more-options > summary { position:relative; flex-wrap:wrap; padding:8px 28px 8px 0; }
 .sk-more-options > summary small { flex:1 1 100%; margin-left:0; }
 details.sk-more-options > summary::after { position:absolute; top:18px; right:2px; margin:0; }
 details.sk-more-options[open] > summary::after { top:22px; margin:0; }
 .sk-more-options[open] { padding-bottom:10px; }
 .sk-sample-card { padding:10px; }
 .sk-panel h3 { margin-top:12px; }
 .sk-meta { margin-top:8px; gap:4px; font-size:12px; }
 .sk-meta span { padding:2px 8px; }
 .sk-card { padding:12px; }
 .sk-card h2 { font-size:16px; }
 .sk-card p { margin:4px 0 10px; }
 .sk-card-foot { padding-top:8px; }
 .sk-field { margin-bottom:10px; }
 .sk-result { margin-top:12px; padding:10px; }
 .sk-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
 .sk-tile { padding:8px 10px; }
 .sk-tile strong { font-size:16px; }
 .sk-tiles .sk-tile:last-child:nth-child(odd) { grid-column:1 / -1; }
 .sk-table--payout :is(th,td) { padding-left:4px; padding-right:4px; }
 .sk-item { padding:10px 12px; }
 .sk-example-grid { grid-template-columns:minmax(0,1fr); gap:8px; }
 .sk-dialog-form { padding:16px; }
 .sk-panel--after { margin-top:10px; }
 .sk-savebar { margin-top:10px; padding:8px 0 10px; }
 .sk-savebar .sk-actions { gap:6px 8px; }
 .sk-savebar .sk-actions > .sk-btn { flex:1 1 auto; padding:6px 12px; }
 .sk-savebar-toggle { display:inline-flex; }
 .sk-savebar:not(.is-open) .sk-savebar-extra { display:none; }
 .sk-savebar-links { margin-left:0; flex:1 1 100%; }
 .sk-item-side { gap:6px; }
 .sk-item-side .sk-btn--small { padding-left:10px; padding-right:10px; }
 .sk-dialog .sk-actions .sk-btn { flex:1 1 120px; }
 .sk-empty--page { padding:28px 12px; }
 .sk-count { margin-bottom:8px; font-size:12px; }
}
@media(max-width:560px) {
 .sk-grid { grid-template-columns:minmax(0,1fr); gap:8px; }
 .sk-row, .sk-row--3 { grid-template-columns:minmax(0,1fr); gap:0; }
 .sk-rep-body { grid-template-columns:minmax(0,1fr); }
 .sk-out-row { grid-template-columns:minmax(64px,34%) minmax(0,1fr); gap:8px; }
 .sk-checklist { grid-template-columns:minmax(0,1fr); }
 .sk-verify, .sk-payform { grid-template-columns:minmax(0,1fr); margin-top:8px; }
 .sk-verify .sk-actions, .sk-payform .sk-actions { margin-bottom:0; }
 .sk-join-steps { gap:4px; margin-bottom:8px; font-size:12px; }
 .sk-join-steps li { padding:6px; gap:4px; }
 .sk-subpanel { margin-top:10px; padding-top:10px; }
 .sk-kv { grid-template-columns:minmax(0,38%) minmax(0,1fr); }
}

/* 탐색: 보기 방식 탭, 카드의 평점·좋아요·사용 건수, 좋아요 버튼, 리뷰 */
.sk-tabs { display:flex; gap:2px; margin:0 0 12px; border-bottom:1px solid var(--sk-line); overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.sk-tabs::-webkit-scrollbar { display:none; }
.sk-tab { flex:0 0 auto; display:inline-flex; align-items:center; min-height:44px; padding:0 14px; border-bottom:2px solid transparent; color:var(--sk-muted) !important; font-size:14px; font-weight:600; text-decoration:none; white-space:nowrap; }
.sk-tab:hover { color:var(--sk-ink) !important; }
.sk-tab.is-on { border-bottom-color:var(--sk-blue); color:var(--sk-blue-deep) !important; font-weight:800; }
/* 가로로 넘기는 줄 안에서는 바깥 테두리가 잘리므로 안쪽으로 그린다. */
.skills-page .sk-tab:focus-visible { outline-offset:-3px; }
/* 내 계정 기준 탭은 앞의 탭들과 한 칸 띄운다. */
.sk-tab:not(.sk-tab--mine) + .sk-tab--mine::before { content:""; width:1px; height:16px; margin-right:14px; background:var(--sk-field); }
.sk-listhead { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 12px; margin:0 0 10px; }
.sk-listhead h2 { font-size:18px; font-weight:800; letter-spacing:-.02em; overflow-wrap:anywhere; }
.sk-listhead p { color:var(--sk-muted); font-size:13px; overflow-wrap:anywhere; }
.sk-listhead p > a { white-space:nowrap; }
.sk-card h3 { font-size:17px; font-weight:750; line-height:1.4; letter-spacing:-.02em; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
/* 통계 줄은 금액 줄 바로 위에 붙여 카드끼리 높이가 맞게 한다. */
.sk-stats { display:flex; flex-wrap:wrap; gap:2px 10px; margin:auto 0 10px; color:var(--sk-muted); font-size:12px; }
.sk-stats + .sk-card-foot { margin-top:0; }
.sk-stat { white-space:nowrap; }
.sk-stat small { margin-left:2px; font-size:12px; font-weight:400; color:#647089; }
.sk-stat--rating { color:var(--sk-ink); font-weight:700; }
.sk-stat--rating > [aria-hidden], .sk-star, .sk-stars { color:#c27a00; }
.sk-stat--liked > [aria-hidden] { color:#c8324a; }
.sk-star { font-style:normal; }
.sk-like { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:6px 16px; border:1px solid var(--sk-field); border-radius:22px; background:#fff; color:var(--sk-ink) !important; font-size:14px; font-weight:600; text-decoration:none; cursor:pointer; transition:background-color .15s, border-color .15s; }
.sk-like:hover { border-color:#e3a3ae; background:#fff5f6; }
.sk-like:disabled { opacity:.6; cursor:progress; }
.sk-like strong { font-variant-numeric:tabular-nums; }
.sk-like-icon { font-size:17px; line-height:1; color:#c8324a; }
.sk-like.is-on { border-color:#e3a3ae; background:#fff0f2; color:#8f1c31 !important; }
.sk-like--static, .sk-like--static:hover { border-color:var(--sk-line); background:var(--sk-soft); cursor:default; }
#sk-like-error { margin:-8px 0 12px; }
.sk-reviews, .sk-related { margin-top:16px; }
.sk-reviews h2 small { margin-left:4px; font-size:13px; font-weight:500; color:var(--sk-muted); }
.sk-review-top { display:grid; grid-template-columns:auto minmax(0,300px); justify-content:start; align-items:center; gap:8px 28px; margin-bottom:14px; padding-bottom:14px; border-bottom:1px solid var(--sk-line-soft); }
.sk-review-score { display:flex; flex-direction:column; align-items:flex-start; }
.sk-review-score strong { font-size:34px; font-weight:800; line-height:1.15; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.sk-stars { font-size:14px; letter-spacing:1px; white-space:nowrap; }
.sk-review-bars li { display:grid; grid-template-columns:28px minmax(0,1fr) 34px; align-items:center; gap:8px; font-size:12px; color:var(--sk-muted); }
.sk-review-bars .num { text-align:right; font-variant-numeric:tabular-nums; }
.sk-bar { height:6px; border-radius:3px; background:var(--sk-line-soft); overflow:hidden; }
.sk-bar i { display:block; height:100%; border-radius:3px; background:#dc9b1c; }
.sk-review-form { margin-bottom:14px; padding:14px; border:1px solid var(--sk-line); border-radius:12px; background:var(--sk-soft); }
.skills-page .sk-review-form h3 { margin:0 0 2px; font-size:14px; color:var(--sk-ink); }
.sk-rate { position:relative; display:inline-flex; margin:0 0 6px -8px; padding:0; border:0; min-width:0; }
.sk-rate input { position:absolute; width:1px; height:1px; opacity:0; }
.sk-rate label { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; font-size:28px; line-height:1; color:#c5cddc; cursor:pointer; }
/* 고른 별과 그 앞의 별을 칠한다. 마우스를 올린 별까지도 미리 칠한다. */
.sk-rate input:checked + label, .sk-rate label:has(~ input:checked), .sk-rate label:hover, .sk-rate label:has(~ label:hover) { color:#dc9b1c; }
.sk-rate input:focus-visible + label { outline:3px solid var(--sk-blue); outline-offset:-4px; border-radius:10px; }
.sk-review-gate { margin-bottom:12px; padding:10px 12px; border-radius:10px; background:var(--sk-soft); }
.sk-review-list { display:flex; flex-direction:column; }
.sk-review { min-width:0; padding:12px 0; border-top:1px solid var(--sk-line-soft); }
.sk-review:first-child { padding-top:0; border-top:0; }
.sk-review:last-child { padding-bottom:0; }
.sk-review-head { display:flex; flex-wrap:wrap; align-items:center; gap:2px 10px; font-size:12px; color:var(--sk-muted); }
.sk-review-head strong { font-size:13px; color:var(--sk-ink); }
.sk-review-head .sk-link { margin-left:auto; }
.sk-review-body { margin-top:4px; white-space:pre-wrap; overflow-wrap:anywhere; color:#33405c; }
@media(prefers-reduced-motion:reduce) { .sk-like { transition:none; } }
@media(max-width:760px) {
 .sk-tabs { margin-bottom:8px; }
 .sk-tab { padding:0 11px; font-size:13px; }
 .sk-tab:not(.sk-tab--mine) + .sk-tab--mine::before { margin-right:11px; }
 .sk-listhead { margin-bottom:8px; }
 .sk-listhead h2 { font-size:16px; }
 .sk-listhead p { font-size:12px; }
 .sk-card h3 { font-size:16px; }
 .sk-stats { margin-bottom:8px; }
 .sk-like { padding:6px 14px; }
 #sk-like-error { margin:0 0 10px; }
 .sk-reviews, .sk-related { margin-top:10px; }
 .sk-review-top { grid-template-columns:auto minmax(0,1fr); gap:6px 16px; margin-bottom:10px; padding-bottom:10px; }
 .sk-review-score strong { font-size:28px; }
 .sk-review-form { margin-bottom:10px; padding:10px; }
 .sk-review { padding:10px 0; }
}

/* 관리자 화면(PC 전용)은 운영 콘솔 레이아웃 안에서 같은 부품만 쓴다. */
#sk-private-original { scroll-margin-top:110px; }
#sk-private-original .sk-panel-head { flex-wrap:wrap; }
#sk-private-original [data-sk-next-version] { margin-bottom:12px; }
#sk-private-original[data-readonly="true"] .sk-uploads { display:none; }
.skills-page :is(input,textarea)[readonly] { color:var(--sk-ink); opacity:1; background:#f6f8fc; cursor:text; }
.skills-admin .sk-chip { cursor:pointer; }
/* 출금 신청 표: 계좌·상태·관리 칸은 잘리지 않게 줄을 바꾼다(운영 콘솔 공통 표는 한 줄 말줄임). */
.skills-admin .component-table td.sk-wrap { white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; line-height:1.4; }
.skills-admin .component-table td.sk-wrap .sk-btn { margin:2px 4px 2px 0; }
.skills-admin .sk-panel :is(h2,p,dl,dd) { margin:0; }
.skills-admin .sk-panel h2 { margin-bottom:10px; }
/* 생성 결과는 원본 종횡비를 유지하며 작은 화면을 넘지 않는다. */
.sk-result-image { margin: 0 0 12px; }
.sk-result-image img { display: block; width: 100%; max-width: 640px; height: auto; border-radius: 8px; margin-bottom: 8px; }
/* 결과 파일(그림·영상·음성·문서) */
.sk-result-files { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin: 0 0 14px; }
.sk-result-file { margin: 0; min-width: 0; border: 1px solid var(--sk-line, #e5e7eb); border-radius: 10px; overflow: hidden; background: #fff; display: flex; flex-direction: column; }
.sk-result-file img, .sk-result-file video { display: block; width: 100%; height: auto; max-height: 520px; object-fit: contain; background: #f4f5f7; }
.sk-result-file audio { display: block; width: calc(100% - 16px); margin: 10px 8px 2px; }
.sk-result-file-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 10px; margin-top: auto; }
.sk-result-file-name { flex: 1 1 100%; min-width: 0; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.sk-result-file-detail { flex: 1 1 auto; font-size: 12px; color: var(--sk-muted, #6b7280); }
.sk-result-file-meta .sk-btn { min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 480px) { .sk-result-files { grid-template-columns: 1fr; gap: 8px; } }

/* 관리자 화면의 구역 제목·상세·검색 */
.sk-admin-jump { display:flex; flex-wrap:wrap; gap:6px 16px; margin:0 0 14px; font-size:13px; }
.sk-admin-jump a { color:var(--sk-blue-deep); text-decoration:underline; text-underline-offset:3px; }
.sk-admin-title { margin:28px 0 8px; font-size:18px; font-weight:700; scroll-margin-top:120px; }
.sk-admin-jump + .sk-admin-title { margin-top:0; }
.sk-admin-panel { margin-top:16px; }
.sk-admin-gap { margin-top:12px; }
.skills-admin .sk-panel .sk-admin-sub { margin:18px 0 6px; font-size:14px; font-weight:700; color:var(--sk-ink); }
.sk-admin-block + .sk-admin-block { margin-top:10px; }
.skills-admin .sk-panel .sk-label { margin:0 0 5px; line-height:1.5; }
/* 실행 번호는 복사해 쓰는 값이라 줄을 바꾸거나 줄이지 않는다. */
.skills-admin .component-table td.sk-admin-mono { white-space:nowrap; overflow:visible; text-overflow:clip; font-family:var(--sk-mono); font-size:12px; letter-spacing:-.02em; }
.sk-admin-minus { color:var(--sk-bad); font-weight:600; }
.sk-admin-block .sk-pre { max-height:360px; }
.sk-admin-history { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; font-size:13px; }
.sk-admin-history li { padding:8px 10px; border:1px solid var(--sk-line-soft); border-radius:8px; background:var(--sk-soft); }
.skills-admin .sk-panel .sk-admin-history p { margin-top:2px; overflow-wrap:anywhere; }
.sk-admin-mono { font-family:var(--sk-mono); font-size:12px; }
.sk-admin-search { display:flex; gap:8px; margin:8px 0; }
.sk-admin-search input, .sk-admin-search select { min-height:40px; padding:6px 12px; border:1px solid var(--sk-field); border-radius:10px; background:#fff; font-size:14px; color:var(--sk-ink); }
.sk-admin-search input { flex:1 1 auto; min-width:0; }
.sk-admin-search select { flex:0 0 170px; }
.sk-admin-wide { grid-column:1 / -1; }
.sk-admin-wide-table { min-width:1300px; }
.skills-admin .sk-chips { margin:8px 0; }
.skills-admin .sk-chip small { margin-left:4px; font-size:12px; font-weight:700; }
.skills-admin .sk-tag + .sk-tag { margin-left:4px; }
.skills-admin .sk-alert { margin:8px 0; }
.skills-admin .sk-panel .sk-alert { margin:0 0 10px; }
.skills-admin .sk-panel .sk-actions { margin-top:10px; }
.skills-admin :is(button,a,input,select,textarea):focus-visible { outline:3px solid var(--sk-blue); outline-offset:2px; }
.skills-admin .component-table td .sk-note { margin:2px 0 0; font-size:12px; }