/* AI 실력 진단 (/skill/). ps2.css, ps2-legacy.css 다음에 불러온다. 모든 규칙은 #sk 안에서만 적용된다. */

#sk {
    --sk-v: #7c3aed;
    --sk-g: #0e8a43;
    --sk-r: #2563eb;
    --sk-l: #d97706;
    --sk-w: #db2777;
    --sk-hi: #0e8a43;
    --sk-mid: #2563eb;
    --sk-lo: #e5484d;
    color: var(--ps-ink);
}
#sk * { box-sizing: border-box; }
#sk p { margin: 0; }
#sk ul, #sk ol { margin: 0; padding: 0; list-style: none; line-height: inherit; }
#sk li, #sk li + li { margin: 0; line-height: inherit; }
#sk a { text-decoration: none; }
#sk h4 { margin: 0; }
#sk .sk-lead { margin: 4px 0 24px; color: var(--ps-ink-2); font-size: 17px; line-height: 1.65; }

/* 버튼 */
#sk .sk-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 22px; border: 1px solid transparent; border-radius: 999px;
    background: #fff; color: var(--ps-ink); font: inherit; font-size: 15.5px; font-weight: 700; letter-spacing: -0.01em; line-height: 1; cursor: pointer;
    transition: transform .2s var(--ps-ease), background .2s, border-color .2s, box-shadow .2s; white-space: nowrap;
}
#sk .sk-btn:active { transform: scale(.97); }
#sk .sk-btn[disabled] { opacity: .45; cursor: default; }
#sk .sk-btn--primary { background: var(--ps-brand); color: #fff; box-shadow: 0 10px 22px -12px rgba(14, 138, 67, .7); }
#sk .sk-btn--primary:hover:not([disabled]) { background: var(--ps-brand-strong); color: #fff; }
#sk .sk-btn--dark { background: var(--ps-ink); color: #fff; }
#sk .sk-btn--dark:hover { background: #1c2740; color: #fff; }
#sk .sk-btn--outline { border-color: var(--ps-line-strong); color: var(--ps-ink); }
#sk .sk-btn--outline:hover { border-color: var(--ps-ink); color: var(--ps-ink); }
#sk .sk-btn--sm { height: 34px; padding: 0 14px; font-size: 13.5px; }
#sk .sk-btn--lg { height: 54px; padding: 0 28px; font-size: 16.5px; }

/* 카드 */
#sk .sk-card { padding: 26px; border: 1px solid var(--ps-line); border-radius: 24px; background: #fff; }
#sk .sk-card + .sk-card, #sk .sk-section { margin-top: 18px; }
#sk .sk-section > h4, #sk .sk-card > h4 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 16px; font-size: 19px; font-weight: 800; letter-spacing: -0.03em; }
#sk .sk-section > h4 small, #sk .sk-card > h4 small { color: var(--ps-ink-3); font-size: 13.5px; font-weight: 500; letter-spacing: 0; }
#sk .sk-note { color: var(--ps-ink-3); font-size: 13.5px; line-height: 1.6; }
#sk .sk-alert { margin-top: 14px; padding: 14px 18px; border-radius: 16px; background: #fff7e6; color: #7a4a00; font-size: 14.5px; line-height: 1.6; }
#sk .sk-alert a { color: inherit; font-weight: 700; text-decoration: underline; }
#sk .sk-alert--err { background: #fdecec; color: #8f1d21; }

/* 칩 */
#sk .sk-chip { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; background: var(--ps-bg-soft); color: var(--ps-ink-2); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
#sk .sk-chip--V { background: #f1eafe; color: var(--sk-v); }
#sk .sk-chip--G { background: var(--ps-brand-soft); color: var(--sk-g); }
#sk .sk-chip--R { background: #e8f0fe; color: var(--sk-r); }
#sk .sk-chip--L { background: #fdf1dd; color: #a85a00; }
#sk .sk-chip--W { background: #fde8f2; color: var(--sk-w); }
#sk .sk-chip--none { background: transparent; border: 1px dashed var(--ps-line-strong); color: var(--ps-ink-3); font-weight: 600; }
#sk .sk-chip--ai { background: var(--ps-ink); color: #fff; }

/* 상단: 종합 점수 + 영역 균형 */
#sk .sk-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 18px; }
#sk .sk-hero__main {
    position: relative; display: flex; flex-direction: column; gap: 18px; padding: 30px; border-radius: 28px; overflow: hidden;
    background: radial-gradient(520px 260px at 100% 0%, rgba(34, 197, 94, .30), transparent 70%), var(--ps-night); color: #fff;
}
#sk .sk-hero__row { display: flex; align-items: center; gap: 22px; }
#sk .sk-ring { position: relative; flex: none; width: 132px; height: 132px; }
#sk .sk-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
#sk .sk-ring circle { fill: none; stroke-width: 11; }
#sk .sk-ring .sk-ring__bg { stroke: rgba(255, 255, 255, .14); }
#sk .sk-ring .sk-ring__fg { stroke: var(--ps-brand-bright); stroke-linecap: round; transition: stroke-dashoffset 1s var(--ps-ease); }
#sk .sk-ring b { position: absolute; inset: 0; display: grid; place-items: center; font-size: 42px; font-weight: 800; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
#sk .sk-ring b small { display: block; margin-top: -6px; color: #a7b3c6; font-size: 12px; font-weight: 600; letter-spacing: 0; text-align: center; }
#sk .sk-hero__txt strong { display: block; font-size: 23px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.35; }
#sk .sk-hero__txt span { display: block; margin-top: 8px; color: #a7b3c6; font-size: 14.5px; line-height: 1.6; }
#sk .sk-delta { display: inline-flex; align-items: center; height: 24px; margin-left: 8px; padding: 0 9px; border-radius: 999px; background: rgba(255, 255, 255, .12); font-size: 13px; font-weight: 700; vertical-align: middle; }
#sk .sk-delta--up { color: #86efac; }
#sk .sk-delta--down { color: #fca5a5; }
#sk .sk-hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
#sk .sk-hero__cta .sk-btn--outline { background: transparent; border-color: rgba(255, 255, 255, .28); color: #fff; }
#sk .sk-hero__cta .sk-btn--outline:hover { border-color: #fff; }
#sk .sk-quota { color: #a7b3c6; font-size: 13.5px; }
#sk .sk-quota b { color: #fff; }
#sk .sk-hero__side { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 18px; border: 1px solid var(--ps-line); border-radius: 28px; }
#sk .sk-radar { width: 100%; max-width: 330px; height: auto; }
#sk .sk-radar text { font-family: inherit; }

/* 처음 온 사람: 3단계 안내 */
#sk .sk-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; counter-reset: sk; }
#sk .sk-steps li { counter-increment: sk; padding: 20px; border: 1px solid var(--ps-line); border-radius: 20px; background: var(--ps-bg-soft); }
#sk .sk-steps li::before { content: counter(sk); display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 12px; border-radius: 10px; background: var(--ps-ink); color: #fff; font-size: 14px; font-weight: 800; }
#sk .sk-steps b { display: block; font-size: 16.5px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-steps span { display: block; margin-top: 6px; color: var(--ps-ink-2); font-size: 14.5px; line-height: 1.6; }
#sk .sk-limits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
#sk .sk-limits div { padding: 14px 16px; border: 1px solid var(--ps-line); border-radius: 16px; font-size: 14px; color: var(--ps-ink-2); }
#sk .sk-limits b { display: block; color: var(--ps-ink); font-size: 20px; font-weight: 800; letter-spacing: -0.03em; }
#sk .sk-limits .is-me { border-color: var(--ps-brand); background: var(--ps-brand-soft); }

/* AI 진단 리포트 */
#sk .sk-report__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 6px; }
#sk .sk-report__head time { color: var(--ps-ink-3); font-size: 13.5px; }
#sk .sk-report__title { font-size: 24px; font-weight: 800; letter-spacing: -0.035em; line-height: 1.35; }
#sk .sk-report__sum { margin-top: 10px; color: var(--ps-ink-2); font-size: 16px; line-height: 1.75; }
#sk .sk-strong { display: grid; gap: 8px; margin-top: 16px; }
#sk .sk-strong li { display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px; border-radius: 14px; background: var(--ps-brand-soft); font-size: 15px; line-height: 1.6; }
#sk .sk-strong li b { flex: none; color: var(--ps-brand-strong); }
#sk .sk-weak { display: grid; gap: 14px; margin-top: 18px; counter-reset: skw; }
#sk .sk-weak > li { counter-increment: skw; padding: 22px; border: 1px solid var(--ps-line); border-radius: 20px; }
#sk .sk-weak__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 14px; }
#sk .sk-weak__head::before { content: "약점 " counter(skw); display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; background: #fdecec; color: var(--sk-lo); font-size: 12.5px; font-weight: 800; }
#sk .sk-weak__head strong { font-size: 18px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-weak__head em { margin-left: auto; color: var(--ps-ink-3); font-size: 13.5px; font-style: normal; font-variant-numeric: tabular-nums; }
#sk .sk-weak dl { display: grid; gap: 12px; margin: 0; }
#sk .sk-weak dt { margin: 0 0 3px; color: var(--ps-ink-3); font-size: 12.5px; font-weight: 800; letter-spacing: .02em; }
#sk .sk-weak dd { margin: 0; color: var(--ps-ink-2); font-size: 15.5px; line-height: 1.75; }
#sk .sk-weak__act { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
#sk .sk-plan { display: grid; gap: 8px; margin-top: 18px; counter-reset: skp; }
#sk .sk-plan li { counter-increment: skp; display: flex; gap: 12px; padding: 12px 16px; border-radius: 14px; background: var(--ps-bg-soft); font-size: 15px; line-height: 1.65; }
#sk .sk-plan li::before { content: counter(skp); flex: none; display: grid; place-items: center; width: 24px; height: 24px; margin-top: 1px; border-radius: 8px; background: #fff; color: var(--ps-ink-3); font-size: 12.5px; font-weight: 800; }
#sk .sk-rx { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 18px; padding: 18px 22px; border-radius: 20px; background: var(--ps-ink); color: #fff; }
#sk .sk-rx b { font-size: 16.5px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-rx span { color: #a7b3c6; font-size: 14px; }
#sk .sk-rx .sk-btn { margin-left: auto; }
#sk .sk-spin { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255, 255, 255, .3); border-top-color: #fff; border-radius: 50%; animation: sk-spin .8s linear infinite; vertical-align: -3px; }
@keyframes sk-spin { to { transform: rotate(360deg); } }

/* 변화 추이 */
#sk .sk-trend svg { display: block; width: 100%; height: auto; }
#sk .sk-trend text { font-family: inherit; fill: var(--ps-ink-3); font-size: 11px; }
#sk .sk-trend .sk-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; opacity: .85; }
#sk .sk-trend .sk-line--o { stroke: var(--ps-ink); stroke-width: 3.2; opacity: 1; }
#sk .sk-trend .sk-line--v { stroke: var(--sk-v); }
#sk .sk-trend .sk-line--g { stroke: var(--sk-g); }
#sk .sk-trend .sk-line--r { stroke: var(--sk-r); }
#sk .sk-trend .sk-line--l { stroke: var(--sk-l); }
#sk .sk-trend .sk-line--w { stroke: var(--sk-w); }
#sk .sk-trend .is-off { display: none; }
#sk .sk-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
#sk .sk-legend button { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px; border: 1px solid var(--ps-line); border-radius: 999px; background: #fff; color: var(--ps-ink-2); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
#sk .sk-legend button i { width: 10px; height: 10px; border-radius: 50%; background: currentColor; }
#sk .sk-legend button.is-off { color: var(--ps-ink-3); opacity: .55; }
#sk .sk-legend button.is-off i { background: var(--ps-line-strong); }

/* 영역별 상세 */
#sk .sk-dom { border: 1px solid var(--ps-line); border-radius: 20px; overflow: hidden; }
#sk .sk-dom + .sk-dom { margin-top: 10px; }
#sk .sk-dom > summary { display: flex; align-items: center; gap: 12px; padding: 16px 20px; cursor: pointer; list-style: none; }
#sk .sk-dom > summary::-webkit-details-marker { display: none; }
#sk .sk-dom > summary strong { font-size: 17px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-dom > summary .sk-dom__sub { color: var(--ps-ink-3); font-size: 13.5px; }
#sk .sk-dom > summary .sk-dom__score { margin-left: auto; font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
#sk .sk-dom > summary::after { content: ""; width: 9px; height: 9px; margin-left: 4px; border-right: 2px solid var(--ps-ink-3); border-bottom: 2px solid var(--ps-ink-3); transform: rotate(45deg); transition: transform .2s; }
#sk .sk-dom[open] > summary::after { transform: rotate(-135deg); }
#sk .sk-dom__body { padding: 4px 20px 18px; border-top: 1px solid var(--ps-line); }
#sk .sk-grp { margin: 16px 0 6px; color: var(--ps-ink-3); font-size: 12.5px; font-weight: 800; letter-spacing: .02em; }
#sk .sk-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(70px, 1fr) 34px 58px 62px; align-items: center; gap: 12px; min-height: 42px; padding: 5px 0; border-bottom: 1px solid var(--ps-line); font-size: 14.5px; }
#sk .sk-row:last-child { border-bottom: 0; }
#sk .sk-row--grp { font-weight: 800; }
#sk .sk-row__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sk .sk-row__name small { margin-left: 6px; color: var(--ps-ink-3); font-size: 12.5px; font-weight: 500; }
#sk .sk-bar { height: 8px; border-radius: 999px; background: var(--ps-bg-soft); overflow: hidden; }
#sk .sk-bar i { display: block; height: 100%; border-radius: 999px; background: var(--sk-mid); }
#sk .sk-bar--hi i { background: var(--sk-hi); }
#sk .sk-bar--lo i { background: var(--sk-lo); }
#sk .sk-row__score { font-weight: 800; font-variant-numeric: tabular-nums; text-align: right; }
#sk .sk-row__conf { color: var(--ps-ink-3); font-size: 12.5px; text-align: center; }
#sk .sk-row__act { text-align: right; }
#sk .sk-row__act a { color: var(--ps-brand); font-size: 13.5px; font-weight: 700; }
#sk .sk-row--none { color: var(--ps-ink-3); }
#sk .sk-row--none .sk-row__score { font-weight: 500; }
#sk .sk-use { display: inline-flex; gap: 6px; margin-left: 8px; color: var(--ps-ink-3); font-size: 12px; font-weight: 600; }

/* 진단 기록 */
#sk .sk-hist { display: grid; gap: 6px; }
#sk .sk-hist a { display: grid; grid-template-columns: 132px 54px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--ps-line); border-radius: 14px; color: var(--ps-ink); font-size: 14.5px; }
#sk .sk-hist a:hover { border-color: var(--ps-line-strong); background: var(--ps-bg-soft); }
#sk .sk-hist a.is-on { border-color: var(--ps-brand); background: var(--ps-brand-soft); }
#sk .sk-hist time { color: var(--ps-ink-3); font-size: 13.5px; font-variant-numeric: tabular-nums; }
#sk .sk-hist b { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; }
#sk .sk-hist span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ps-ink-2); }
#sk .sk-hist i { color: var(--ps-ink-3); font-size: 13px; font-style: normal; }

/* AI 대기 화면 */
#sk .sk-wait { position: fixed; inset: 0; z-index: 400; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(11, 19, 36, .62); backdrop-filter: blur(6px); }
#sk .sk-wait.is-on { display: flex; }
#sk .sk-wait__box { width: min(420px, 100%); padding: 32px 28px; border-radius: 26px; background: #fff; text-align: center; box-shadow: var(--ps-shadow-lg); }
#sk .sk-wait__box .sk-spin { width: 34px; height: 34px; border-width: 3px; border-color: var(--ps-line); border-top-color: var(--ps-brand); }
#sk .sk-wait__box b { display: block; margin-top: 16px; font-size: 19px; font-weight: 800; letter-spacing: -0.03em; }
#sk .sk-wait__box span { display: block; margin-top: 8px; color: var(--ps-ink-2); font-size: 14.5px; line-height: 1.65; }

/* 문제 풀기 (진단 테스트 · 연습) */
#sk.sk-run { max-width: 820px; }
#sk .sk-run__top { display: flex; align-items: center; gap: 14px; margin: 6px 0 20px; }
#sk .sk-run__bar { flex: 1; height: 8px; border-radius: 999px; background: var(--ps-bg-soft); overflow: hidden; }
#sk .sk-run__bar i { display: block; width: 0; height: 100%; border-radius: 999px; background: var(--ps-brand); transition: width .4s var(--ps-ease); }
#sk .sk-run__count { color: var(--ps-ink-3); font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
#sk .sk-q__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--ps-ink-3); font-size: 13.5px; }
#sk .sk-q__ins { padding: 14px 18px; border-radius: 16px; background: var(--ps-bg-soft); font-size: 16.5px; font-weight: 700; line-height: 1.6; }
#sk .sk-q__audio { width: 100%; margin-top: 14px; }
#sk .sk-q__img { margin-top: 14px; text-align: center; }
#sk .sk-q__img img { max-width: 100%; border-radius: 14px; }
#sk .sk-q__img--sm img { max-width: 220px; }
#sk .sk-q__passage { margin-top: 16px; font-size: 17px; line-height: 1.85; overflow-wrap: break-word; }
#sk .sk-q__passage u { text-underline-offset: 4px; text-decoration-thickness: 2px; }
#sk .sk-q__passage img { max-width: 100%; height: auto; }
#sk .sk-q__choices { display: grid; gap: 8px; margin-top: 20px; }
#sk .sk-choice {
    display: flex; align-items: flex-start; gap: 12px; width: 100%; padding: 13px 16px; border: 1px solid var(--ps-line-strong); border-radius: 16px; background: #fff;
    color: var(--ps-ink); font: inherit; font-size: 16px; line-height: 1.6; text-align: left; cursor: pointer; transition: border-color .15s, background .15s;
}
#sk .sk-choice b { flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ps-bg-soft); font-size: 13.5px; font-weight: 800; }
#sk .sk-choice:hover:not([disabled]) { border-color: var(--ps-ink); }
#sk .sk-choice.is-on { border-color: var(--ps-brand); background: var(--ps-brand-soft); }
#sk .sk-choice.is-on b { background: var(--ps-brand); color: #fff; }
#sk .sk-choice[disabled] { cursor: default; }
#sk .sk-choice.is-right { border-color: var(--sk-hi); background: var(--ps-brand-soft); }
#sk .sk-choice.is-right b { background: var(--sk-hi); color: #fff; }
#sk .sk-choice.is-wrong { border-color: var(--sk-lo); background: #fdecec; }
#sk .sk-choice.is-wrong b { background: var(--sk-lo); color: #fff; }
#sk .sk-q__choices--num { grid-template-columns: repeat(5, minmax(0, 1fr)); }
#sk .sk-q__choices--num .sk-choice { justify-content: center; }
#sk .sk-q__act { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; }
#sk .sk-fb { margin-top: 16px; padding: 18px 20px; border-radius: 18px; background: var(--ps-brand-soft); }
#sk .sk-fb--no { background: #fdecec; }
#sk .sk-fb strong { display: block; font-size: 18px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-fb__move { margin-top: 4px; color: var(--ps-ink-2); font-size: 14px; }
#sk .sk-fb__note { margin-top: 12px; color: var(--ps-ink-2); font-size: 15px; line-height: 1.75; }
#sk .sk-fb__note b { color: var(--ps-ink); }
#sk .sk-fb details { margin-top: 12px; }
#sk .sk-fb summary { color: var(--ps-ink-2); font-size: 14px; font-weight: 700; cursor: pointer; }
#sk .sk-fb__expl { margin-top: 10px; padding: 14px 16px; border-radius: 14px; background: #fff; font-size: 15px; line-height: 1.8; overflow-wrap: break-word; }
#sk .sk-fb__expl img { max-width: 100%; height: auto; }
#sk .sk-report-link { margin-left: auto; border: 0; background: none; color: var(--ps-ink-3); font: inherit; font-size: 13px; text-decoration: underline; cursor: pointer; }
#sk .sk-done { padding: 40px 28px; border: 1px solid var(--ps-line); border-radius: 26px; text-align: center; }
#sk .sk-done b { display: block; font-size: 24px; font-weight: 800; letter-spacing: -0.035em; }
#sk .sk-done span { display: block; margin: 10px 0 22px; color: var(--ps-ink-2); font-size: 15.5px; line-height: 1.7; }
#sk .sk-done div { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

/* (수능 · 문법 · 작문 화면에 붙는 안내 .sk-cta 는 모든 페이지에서 쓰이므로 ps2-legacy.css 에 있다) */

@media (max-width: 900px) {
    #sk .sk-hero { grid-template-columns: minmax(0, 1fr); }
    #sk .sk-steps, #sk .sk-limits { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
    #sk .sk-card { padding: 18px; border-radius: 20px; }
    #sk .sk-hero__main { padding: 22px; }
    #sk .sk-hero__row { flex-direction: column; align-items: flex-start; }
    #sk .sk-row { grid-template-columns: minmax(0, 1fr) 30px 50px; gap: 8px; }
    #sk .sk-row .sk-bar, #sk .sk-row__conf { display: none; }
    #sk .sk-hist a { grid-template-columns: 96px 44px minmax(0, 1fr); }
    #sk .sk-hist i { display: none; }
    #sk .sk-rx .sk-btn { margin-left: 0; }
    #sk .sk-q__passage { font-size: 16px; }
}

/* ───────── 문항 깊이 보기 (/skill/q.jsp) ───────── */
#sk h5 { margin: 0 0 6px; color: var(--ps-ink-3); font-size: 13.5px; font-weight: 800; letter-spacing: .01em; }
#sk.sk-deep section p, #sk .sk-tier__txt { color: var(--ps-ink-2); font-size: 15.5px; line-height: 1.8; }
#sk .sk-deep__flow { display: flex; flex-direction: column; gap: 18px; margin-top: 18px; }
#sk .sk-deep__flow .sk-card + .sk-card { margin-top: 0; }
#sk .sk-need { margin-top: 18px; }
#sk .sk-need__row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
#sk .sk-need__row span { display: inline-flex; align-items: baseline; gap: 6px; padding: 8px 14px; border-radius: 12px; background: var(--ps-bg-soft); color: var(--ps-ink-2); font-size: 13.5px; }
#sk .sk-need__row b { color: var(--ps-ink); font-size: 18px; font-weight: 800; }
#sk .sk-tier__tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-bottom: 12px; }
#sk .sk-tier__tabs a { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border: 1px solid var(--ps-line-strong); border-radius: 999px; color: var(--ps-ink-2); font-size: 13.5px; font-weight: 700; }
#sk .sk-tier__tabs a.is-on { border-color: var(--ps-ink); background: var(--ps-ink); color: #fff; }
#sk .sk-tier__task { margin-top: 12px; padding: 12px 16px; border-radius: 14px; background: var(--ps-brand-soft); font-size: 15px; line-height: 1.7; }
#sk .sk-tier__task a { color: var(--ps-brand-strong); font-weight: 700; }
#sk .sk-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
#sk .sk-more { margin-top: 12px; }
#sk .sk-more summary { color: var(--ps-ink-2); font-size: 14px; font-weight: 700; cursor: pointer; }
#sk .sk-more p { margin-top: 8px; }
#sk .sk-struct { display: grid; gap: 8px; counter-reset: sks; }
#sk .sk-struct li { counter-increment: sks; display: grid; grid-template-columns: 26px minmax(0, 190px) minmax(0, 1fr); gap: 2px 12px; align-items: baseline; padding: 12px 14px; border-radius: 14px; background: var(--ps-bg-soft); font-size: 14.5px; line-height: 1.65; }
#sk .sk-struct li::before { content: counter(sks); grid-row: 1 / span 2; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; background: #fff; color: var(--ps-ink-3); font-size: 12.5px; font-weight: 800; }
#sk .sk-struct li b { grid-column: 2; font-weight: 800; }
#sk .sk-struct li em { grid-column: 2; color: var(--ps-ink-3); font-size: 12.5px; font-style: normal; }
#sk .sk-struct li span { grid-column: 3; grid-row: 1 / span 2; color: var(--ps-ink-2); }
#sk .sk-bar--lvl { height: 10px; }
#sk .sk-bar--lvl i { background: linear-gradient(90deg, #22c55e, #f59e0b, #e5484d); }
#sk .sk-ch { display: grid; gap: 8px; }
#sk .sk-ch__row { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 12px 14px; border: 1px solid var(--ps-line); border-radius: 14px; }
#sk .sk-ch__row > b { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ps-bg-soft); font-size: 13px; }
#sk .sk-ch__row.is-ans { border-color: var(--ps-brand); background: var(--ps-brand-soft); }
#sk .sk-ch__row.is-ans > b { background: var(--ps-brand); color: #fff; }
#sk .sk-ch__row.is-mine { border-color: var(--sk-lo); }
#sk.sk-deep .sk-ch__txt { margin-bottom: 4px; color: var(--ps-ink); font-weight: 600; }
#sk .sk-sent { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--ps-line); }
#sk .sk-sent:last-child { border-bottom: 0; }
#sk .sk-sent__n { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--ps-bg-soft); color: var(--ps-ink-3); font-size: 12.5px; font-weight: 800; }
#sk .sk-sent.is-key .sk-sent__n { background: var(--ps-brand); color: #fff; }
#sk.sk-deep .sk-sent__en { color: var(--ps-ink); font-size: 16.5px; font-weight: 600; line-height: 1.7; }
#sk.sk-deep .sk-sent__chunk { margin-top: 6px; padding-left: 12px; border-left: 3px solid var(--ps-line); font-size: 14.5px; }
#sk.sk-deep .sk-sent__gr { margin-top: 6px; font-size: 14.5px; }
#sk .sk-voc { display: grid; }
#sk .sk-voc__row { display: grid; grid-template-columns: minmax(110px, 190px) minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--ps-line); font-size: 15px; }
#sk .sk-voc__row:last-child { border-bottom: 0; }
#sk .sk-voc__row b { font-weight: 800; }
#sk .sk-voc__row span { color: var(--ps-ink-2); }
#sk .sk-voc__row small { display: block; color: var(--ps-ink-3); font-size: 13px; }
#sk .sk-voc__row em { color: var(--ps-ink-3); font-size: 12.5px; font-style: normal; white-space: nowrap; }
#sk .sk-voc__row.is-above b { color: var(--sk-lo); }

/* ───────── 부족할 가능성이 높은 능력, 수능 풀이 통계, 현재 상태 글 ───────── */
#sk .sk-funnel { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 14px; color: var(--ps-ink-2); font-size: 14.5px; }
#sk .sk-funnel b { padding: 6px 12px; border-radius: 10px; background: var(--ps-bg-soft); color: var(--ps-ink); font-size: 16px; font-weight: 800; }
#sk .sk-kc { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; }
#sk .sk-kc__it { padding: 12px 14px; border: 1px solid var(--ps-line); border-radius: 14px; font-size: 14.5px; }
#sk .sk-kc__it.is-weak { border-color: var(--sk-lo); background: #fdecec; }
#sk .sk-kc__it b { display: block; font-weight: 800; overflow-wrap: anywhere; }
#sk .sk-kc__it small { display: block; margin-top: 3px; color: var(--ps-ink-3); font-size: 12.5px; line-height: 1.5; }
#sk .sk-kc__it small a { color: var(--ps-brand); font-weight: 700; }
#sk .sk-stat { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px 22px; }
#sk .sk-stat__row { display: grid; grid-template-columns: minmax(0, 1fr) 76px 64px; gap: 10px; align-items: center; padding: 5px 0; font-size: 14px; }
#sk .sk-stat__row em { color: var(--ps-ink-2); font-style: normal; font-variant-numeric: tabular-nums; text-align: right; }
#sk .sk-profile { margin-top: 14px; padding: 18px 20px; border-radius: 18px; background: var(--ps-bg-soft); color: var(--ps-ink-2); font-size: 15.5px; line-height: 1.85; }
#sk .sk-cando { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
#sk .sk-cando div { padding: 14px 16px; border: 1px solid var(--ps-line); border-radius: 16px; }
#sk .sk-cando li { position: relative; padding: 3px 0 3px 16px; color: var(--ps-ink-2); font-size: 14.5px; line-height: 1.65; }
#sk .sk-cando li::before { content: ""; position: absolute; left: 2px; top: 13px; width: 6px; height: 6px; border-radius: 50%; background: var(--ps-brand); }
#sk .sk-cando div + div li::before { background: var(--sk-lo); }
#sk .sk-wronglist { display: grid; gap: 6px; margin-top: 18px; text-align: left; }
#sk .sk-wronglist a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 1px solid var(--ps-line); border-radius: 12px; color: var(--ps-ink); font-size: 14.5px; }
#sk .sk-wronglist a:hover { border-color: var(--ps-ink); }
@media (max-width: 640px) {
    #sk .sk-two, #sk .sk-cando { grid-template-columns: minmax(0, 1fr); }
    #sk .sk-struct li { grid-template-columns: 26px minmax(0, 1fr); }
    #sk .sk-struct li span { grid-column: 2; grid-row: auto; }
    #sk .sk-voc__row { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}
/* ───────── 부족한 능력: 펼치면 맞춤 설명 / 맞춤 강화 글 (2026-10-05 3차) ───────── */
#sk .sk-kc__h { margin: 18px 0 8px; color: var(--ps-ink); font-size: 15.5px; }
#sk .sk-kc__h small { margin-left: 8px; color: var(--ps-ink-3); font-size: 12.5px; font-weight: 500; }
#sk .sk-kc { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
#sk details.sk-kc__it { padding: 0; }
#sk details.sk-kc__it > summary { display: block; padding: 12px 14px; cursor: pointer; list-style: none; }
#sk details.sk-kc__it > summary::-webkit-details-marker { display: none; }
#sk details.sk-kc__it > summary::after { content: "설명 보기"; display: inline-block; margin-top: 6px; color: var(--ps-brand); font-size: 12.5px; font-weight: 700; }
#sk details.sk-kc__it[open] { grid-column: 1 / -1; }
#sk details.sk-kc__it[open] > summary::after { content: "접기"; }
#sk .sk-kc__it small b { display: inline; color: var(--sk-lo); }
#sk .sk-kc__body { padding: 0 14px 14px; border-top: 1px solid var(--ps-line); }
#sk .sk-kc__body p { margin-top: 10px; color: var(--ps-ink-2); font-size: 14.5px; line-height: 1.75; }
#sk .sk-kc__body p.en { color: var(--ps-ink); font-size: 15.5px; font-weight: 600; }
#sk .sk-kc__body b { display: inline; color: var(--ps-ink); }
#sk .sk-kc__body a { color: var(--ps-brand); font-weight: 700; }
#sk .sk-boost__title { margin-top: 12px; font-size: 19px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-boost__en { margin-top: 10px; padding: 18px 20px; border-radius: 18px; background: var(--ps-bg-soft); color: var(--ps-ink); font-size: 17px; line-height: 1.9; }
#sk .sk-boost__en b { padding: 0 3px; border-radius: 5px; background: var(--ps-mark); font-weight: 700; }
@media (max-width: 640px) {
    #sk .sk-kc { grid-template-columns: minmax(0, 1fr); }
}
/* ───────── 단계별 처방과 강화 글 (기초 · 중간 · 심화 탭) ───────── */
#sk #stage .sk-tier__tabs a { height: 36px; padding: 0 16px; font-size: 14px; }
#sk .sk-boost { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--ps-line); }
#sk .sk-boost > h4 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0 0 8px; font-size: 17px; font-weight: 800; letter-spacing: -0.02em; }
#sk .sk-boost > h4 small { color: var(--ps-ink-3); font-size: 13px; font-weight: 500; letter-spacing: 0; }