:root {
  --canvas: #fff;
  --paper: #fff;
  --ink: #000;
  --muted: #525252;
  --line: #d5d5cc;
  --blue: #1d4ed8;
  --green: #15803d;
  --red: #dc2626;
  --sans: "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
  --mono: "SFMono-Regular", Consolas, monospace;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--canvas); color: var(--ink); font: 16px/1.65 var(--sans); word-break: keep-all; overflow-wrap: anywhere; }
a { color: var(--blue); text-underline-offset: 4px; }
button, input, select { font: inherit; color: inherit; border-radius: 0; }
button, select { cursor: pointer; }
button, a, summary { touch-action: manipulation; }
button { background: var(--paper); border: 1px solid var(--ink); padding: 9px 14px; min-height: 44px; line-height: 1.45; }
button:hover { color: var(--blue); border-color: var(--blue); }
button:disabled { cursor: not-allowed; opacity: .55; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
select, input { width: 100%; min-height: 44px; border: 1px solid #8c8c84; background: var(--paper); padding: 10px; font-size: 14px; }
input::placeholder { color: #686860; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3, h4 { line-height: 1.4; letter-spacing: -.04em; text-wrap: pretty; }
p { margin-bottom: 16px; }
summary { cursor: pointer; min-height: 44px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 16px; top: -100px; padding: 12px; background: var(--paper); z-index: 30; }
.skip-link:focus { top: 12px; }
main { max-width: 1440px; margin: 0 auto; padding: 24px clamp(16px, 3vw, 40px) 40px; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
h1 { font-size: 24px; margin-bottom: 4px; font-weight: 700; }
.page-meta { font-size: 13px; color: var(--muted); margin: 0; }
.workspace-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; }
.campaign-label { display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 650; flex: 0 1 420px; }
.campaign-label select { flex: 1; min-width: 0; }
.muted { color: var(--muted); }
.stats { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; font-size: 13px; }
.stat { display: flex; gap: 5px; }
.stat dt { color: var(--muted); }
.stat dd { margin: 0; white-space: nowrap; }
.stat strong { font-weight: 650; font-variant-numeric: tabular-nums; }
.scope-note { font-size: 13px; color: var(--muted); margin: 12px 0 8px; }
.view-nav { display: flex; border-bottom: 1px solid var(--line); gap: 24px; margin-bottom: 20px; }
.view-nav button { background: transparent; border: 0; padding: 10px 2px; font-size: 14px; font-weight: 650; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.view-nav button[aria-current="page"] { color: var(--blue); border-bottom-color: var(--blue); }
.research-workspace { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 24px; align-items: start; }
.filters { border-right: 1px solid var(--line); padding-right: 20px; position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow: auto; }
.filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
.filter-heading h2 { font-size: 16px; margin: 0; }
.text-button { background: transparent; border: 0; padding: 8px 0; font-size: 12px; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.filters form { display: grid; gap: 14px; }
.filters label { font-weight: 650; font-size: 13px; display: grid; gap: 6px; }
.filters select, .filters input { font-weight: 400; font-size: 13px; }
.more-filters { border-top: 1px solid var(--line); padding-top: 8px; }
.more-filters summary { font-size: 12px; display: list-item; padding: 10px 0; }
.more-filters label { margin-top: 12px; }
.filter-footnote { font-size: 12px; color: var(--muted); margin: 16px 0 0; }
.presets { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin-bottom: 10px; }
.presets > span { font-size: 12px; margin-right: 4px; color: var(--muted); }
.presets button { font-size: 12px; border-color: #8c8c84; padding: 8px 12px; }
.evidence-map { border-bottom: 1px solid var(--line); }
.evidence-map summary { padding: 10px 0; font-size: 12px; font-weight: 650; }
.evidence-map summary span { font-weight: 400; color: var(--muted); margin-left: 8px; }
.evidence-map > p { font-size: 12px; color: var(--muted); margin: 10px 0; }
#matrix { overflow-x: auto; }
#matrix table { width: 100%; border-collapse: collapse; font-size: 11px; text-align: center; }
#matrix th { font-weight: 500; padding: 8px 4px; }
#matrix td { padding: 3px; }
#matrix button { width: 100%; font-size: 14px; font-variant-numeric: tabular-nums; border-color: var(--line); }
#matrix button:hover { border-color: var(--blue); }
.results-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0 0; }
#result-count { font-size: 13px; margin: 0; }
#result-count strong { font-size: 16px; font-variant-numeric: tabular-nums; }
.result-actions { display: flex; gap: 8px; }
.result-actions select { width: auto; max-width: 210px; font-size: 12px; }
.result-actions button { font-size: 12px; white-space: nowrap; }
.active-filters { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0; }
.active-filters:empty { display: none; }
.active-filters button { font-size: 12px; padding: 5px 9px; color: var(--blue); border-color: var(--blue); }
.source-list { display: grid; }
.source-card { border-bottom: 1px solid var(--line); padding: 20px 0; }
.card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.tag { font-size: 12px; }
.tag.grade-a { color: var(--green); }
.tag.grade-b { color: var(--blue); }
.tag.grade-d { color: var(--red); }
.tag.important, .tag.direct { font-weight: 650; }
.source-card h3 { font-size: 20px; margin: 0 0 8px; }
.source-title-button { text-align: left; font: inherit; letter-spacing: inherit; border: 0; padding: 0; min-height: 44px; color: var(--ink); background: none; }
.source-title-button:hover { text-decoration: underline; text-underline-offset: 4px; }
.source-author { font-size: 12px; color: var(--muted); margin-bottom: 12px; }
.source-evidence { font-size: 14px; line-height: 1.8; margin-bottom: 14px; max-width: 86ch; }
.source-application { font-size: 14px; line-height: 1.75; color: var(--muted); margin-bottom: 8px; }
.source-application b { display: block; color: var(--ink); font-size: 12px; margin-bottom: 4px; }
.card-footer { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.card-topics { font-size: 12px; color: var(--muted); }
.card-footer button { border: 0; font-size: 12px; padding: 6px 0; color: var(--blue); }
.empty-state { padding: 32px 0; }
.empty-state h3 { font-size: 18px; }
.empty-state p { color: var(--muted); }
.reading-view { max-width: 1120px; margin: 0 auto; }
.section-intro { margin-bottom: 16px; }
.section-intro h2 { font-size: 22px; margin-bottom: 8px; }
.section-intro > p:last-child { color: var(--muted); font-size: 14px; }
.campaign-section { margin-bottom: 32px; }
.campaign-section > h3 { font-size: 20px; }
.conclusion-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 16px 24px; }
.insight { padding: 16px 0; border-top: 1px solid var(--line); }
.insight h4 { font-size: 18px; margin: 8px 0; }
.insight p, .insight li { font-size: 14px; }
.decision-status, .task-status { font-size: 13px; color: var(--muted); }
.insight .caution { color: var(--muted); font-size: 12px; border-top: 1px solid var(--line); padding-top: 12px; }
.evidence-links { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 12px; }
.evidence-links button { color: var(--blue); font: 12px var(--mono); padding: 5px 0; border: 0; text-decoration: underline; text-underline-offset: 3px; }
.subsection-title { font-size: 20px; margin: 28px 0 12px; }
.competency-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px 24px; }
.competency { border-top: 1px solid var(--line); padding: 16px 0; }
.competency h4 { font-size: 18px; }
.competency p { font-size: 13px; }
.competency .non-evidence { color: var(--muted); font-size: 12px; }
.anchor-examples { border-top: 1px solid var(--line); margin-top: 14px; }
.anchor-examples summary { padding: 10px 0; font-size: 12px; }
.anchor-examples p { padding-left: 12px; border-left: 2px solid var(--line); }
.task-idea { border-top: 1px solid var(--line); padding: 20px 0; margin-bottom: 12px; }
.task-idea h4 { font-size: 20px; margin: 8px 0; }
.task-idea dl { display: grid; grid-template-columns: 105px 1fr; font-size: 14px; gap: 10px 20px; }
.task-idea dt { font-weight: 700; }
.task-idea dd { margin: 0; }
.notice { font-size: 14px; margin: 16px 0; }
.danger { border-left: 2px solid var(--red); padding-left: 12px; }
.method-block { padding: 20px 0; border-top: 1px solid var(--line); margin: 12px 0; }
.method-block h3 { font-size: 18px; }
.method-block p, .method-block li { font-size: 14px; }
.method-block li + li { margin-top: 8px; }
.method-block table { border-collapse: collapse; width: 100%; font-size: 13px; text-align: left; }
.method-block td, .method-block th { border-bottom: 1px solid var(--line); padding: 12px 8px; vertical-align: top; }
.method-block th { white-space: nowrap; }
.method-block code { font-size: 12px; }
dialog { width: min(900px, calc(100% - 32px)); max-height: calc(100dvh - 48px); padding: 0; border: 1px solid var(--line); background: var(--paper); color: var(--ink); overscroll-behavior: contain; }
dialog::backdrop { background: rgb(0 0 0 / .35); }
.dialog-toolbar { position: sticky; top: 0; background: var(--paper); padding: 12px 28px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 16px; z-index: 1; font-size: 14px; }
.dialog-toolbar button { font-size: 13px; }
#source-detail { padding: 24px; }
#source-detail h2 { font-size: 24px; margin: 12px 0; }
.original-title { color: var(--muted); font-size: 14px; }
.detail-section { border-top: 1px solid var(--line); padding-top: 20px; margin-top: 24px; }
.detail-section h3 { font-size: 16px; margin-bottom: 10px; }
.detail-section p { font-size: 14px; line-height: 1.85; }
.detail-section dl { display: grid; grid-template-columns: 110px 1fr; font-size: 13px; gap: 10px 16px; }
.detail-section dt { color: var(--muted); }
.detail-section dd { margin: 0; }
blockquote { margin: 0 0 16px; padding: 8px 16px; border-left: 2px solid var(--line); font-size: 14px; overflow-wrap: anywhere; }
.source-url { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; margin-top: 8px; }
@media (max-width: 1080px) {
  .research-workspace { grid-template-columns: 220px minmax(0, 1fr); gap: 20px; }
}
@media (max-width: 760px) {
  main { padding-top: 16px; }
  .page-header { flex-wrap: wrap; gap: 4px 12px; margin-bottom: 12px; }
  h1 { font-size: 20px; }
  .workspace-heading { flex-direction: column; align-items: stretch; gap: 12px; }
  .campaign-label { flex: none; }
  .view-nav { gap: 12px; justify-content: space-between; }
  .view-nav button { font-size: 13px; }
  .research-workspace { grid-template-columns: 1fr; }
  .filters { position: static; max-height: none; border-right: 0; border-bottom: 1px solid var(--line); padding: 0 0 16px; }
  .filters form { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
  .filters label:first-child, .more-filters { grid-column: 1 / -1; }
  .filters input, .filters select, .campaign-label select { font-size: 16px; }
  .filter-footnote { margin-top: 16px; }
  .results-toolbar { flex-wrap: wrap; }
  .result-actions { width: 100%; }
  .result-actions select { flex: 1; max-width: none; }
  .evidence-map summary span { display: none; }
  .source-card h3 { font-size: 20px; }
  .source-evidence { font-size: 16px; }
  .source-application { font-size: 14px; }
  .task-idea, .insight, .method-block { padding: 16px 0; }
  .task-idea dl { grid-template-columns: 1fr; gap: 4px; }
  .task-idea dd { margin-bottom: 12px; }
  .task-idea p, .task-idea dd, .insight p, .method-block p, .method-block li { font-size: 16px; }
  .method-block { overflow-x: auto; }
  .detail-section dl { grid-template-columns: 1fr; gap: 4px; }
  .detail-section dd { margin-bottom: 12px; }
  #source-detail { padding: 20px; }
  #source-detail h2 { font-size: 24px; }
  .dialog-toolbar { padding: 12px 20px; }
  .detail-section p { font-size: 16px; }
}
@media (prefers-reduced-motion: no-preference) {
  button, a { transition: color .15s, border-color .15s, background-color .15s; }
}
@media print {
  body { background: white; }
  .filters, .presets, .result-actions, .view-nav, .evidence-map, .active-filters { display: none; }
  .research-workspace { display: block; }
  .source-card, .insight, .task-idea { break-inside: avoid; }
  .page-header { margin-bottom: 16px; }
  .source-list { gap: 16px; }
}
.jd-study { margin: 24px 0 36px; }
.jd-heading { display: flex; align-items: start; justify-content: space-between; gap: 24px; }
.jd-heading h2 { max-width: 800px; font-size: 25px; }
.jd-heading > a { flex-shrink: 0; padding-top: 10px; font-size: 14px; }
.jd-eyebrow { font-size: 12px; color: var(--blue); font-weight: 700; margin-bottom: 6px; }
.jd-review-status { padding: 12px 16px; border-left: 3px solid var(--blue); background: #f5f7fc; font-size: 14px; }
.jd-counts { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border: 1px solid var(--line); margin: 20px 0 12px; }
.jd-counts > div { padding: 16px; border-right: 1px solid var(--line); }
.jd-counts > div:last-child { border: 0; }
.jd-counts dt { color: var(--muted); font-size: 13px; }
.jd-counts dd { margin: 4px 0 0; font-size: 30px; font-weight: 700; }
.jd-counts small { font-size: 13px; margin-left: 6px; font-weight: 400; }
.jd-note { color: var(--muted); font-size: 14px; }
.jd-block { padding: 24px 0; border-bottom: 1px solid var(--line); }
.jd-block h3 { font-size: 20px; }
.jd-block p, .jd-block li { font-size: 14px; }
.jd-block details > summary { padding: 8px 0; font-weight: 650; }
.jd-controls { display: flex; gap: 16px; margin: 18px 0 12px; }
.jd-controls label, #jd-source-audit > label { display: grid; gap: 6px; font-size: 13px; font-weight: 650; min-width: 230px; }
#jd-source-audit > label { max-width: 300px; margin-bottom: 12px; }
.jd-table-wrap { overflow-x: auto; }
.jd-table { border-collapse: collapse; width: 100%; font-size: 13px; text-align: left; }
.jd-table caption { text-align: left; color: var(--muted); padding: 8px 0; }
.jd-table th, .jd-table td { padding: 12px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.jd-table thead { background: #f5f5f2; }
.jd-table tbody th { font-weight: 600; min-width: 200px; }
.jd-table th button { text-align: left; border: 0; color: var(--blue); background: transparent; padding: 0; }
.jd-table th button[aria-pressed="true"] { text-decoration: underline; font-weight: 700; }
.jd-table td:nth-last-child(-n+2) { font-variant-numeric: tabular-nums; }
.jd-evidence { margin-top: 18px; padding: 20px; background: #f7f8fa; }
.jd-evidence > p:last-child { margin-bottom: 0; }
.jd-quote { border-top: 1px solid var(--line); padding-top: 12px; }
.jd-examples { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.jd-examples article { padding: 16px; border: 1px solid var(--line); }
.jd-examples h4 { margin: 8px 0; font-size: 17px; }
.jd-source-heading { margin: 32px 0 0; font-size: 20px; }
@media (max-width:760px) {
  .jd-heading, .jd-controls { flex-direction: column; gap: 10px; }
  .jd-heading h2 { font-size: 22px; }
  .jd-counts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .jd-counts > div { border-bottom: 1px solid var(--line); }
  .jd-examples { grid-template-columns: 1fr; }
  .jd-controls select { font-size: 16px; }
  .jd-table { min-width: 620px; }
  .jd-evidence { padding: 16px; }
}