.course-shell{max-width:760px;margin:0 auto;padding:28px 20px 64px}.course-back{margin:0 0 28px}.course-back a,.course-link{color:inherit}.course-header{margin-bottom:24px}.course-header h1{margin:.2rem 0 .6rem}.eyebrow{letter-spacing:.12em;font-size:.72rem;font-weight:700}.course-lede{color:#667085}.course-editor{padding:18px;border:1px solid #d9dee8;border-radius:16px;background:#fff}.course-editor label{display:block;font-weight:700;margin-bottom:8px}.course-title-row{display:flex;gap:8px}.course-title-row input{min-width:0;flex:1;padding:11px;border:1px solid #b9c1d0;border-radius:9px;font:inherit}.course-title-row button,.course-action{border:0;border-radius:9px;padding:10px 13px;background:#173b66;color:#fff;font:inherit;cursor:pointer;display:inline-block;text-decoration:none}.course-notice{min-height:1.4em;margin:.7rem 0 0;color:#536273;font-size:.9rem}.course-items{display:grid;gap:12px;margin-top:18px}.course-item{display:grid;grid-template-columns:64px 1fr auto;gap:13px;align-items:center;padding:12px;border:1px solid #d9dee8;border-radius:14px;background:#fff}.course-item img,.course-item__placeholder{width:64px;height:64px;border-radius:10px;object-fit:cover;background:#eef1f5}.course-item__title{margin:0 0 5px;font-weight:700}.course-item__meta{margin:0;color:#667085;font-size:.85rem}.course-item__actions{display:flex;gap:5px}.course-action{padding:7px 9px;background:#eef3f9;color:#173b66}.course-action--remove{color:#a33a3a;background:#fff0f0}.course-action:disabled{opacity:.4;cursor:default}.course-distance{margin-top:18px;padding:14px 16px;border-radius:12px;background:#f2f7fb;color:#26445d}.course-distance h2{font-size:1rem;margin:0 0 6px}.course-distance p{margin:.35rem 0;font-size:.9rem}.course-empty{margin-top:18px;padding:32px 20px;text-align:center;border:1px dashed #b9c1d0;border-radius:16px}.course-empty h2{font-size:1.1rem}.course-empty p{color:#667085}@media(max-width:520px){.course-item{grid-template-columns:52px 1fr}.course-item img,.course-item__placeholder{width:52px;height:52px}.course-item__actions{grid-column:2}.course-title-row{flex-direction:column}}

/* ★ 2026-09-06 KSK-LOOK 확장 — css/tokens-ksk.css(worker-4 영역, 무접촉)의 --ksk-* 변수만 쓴다(폴백 0개).
   구 블록은 무변경 · 신규 블록이 같은 선택자를 재정의해 렌더 색만 바꾼다.
   danger색(course-action--remove)은 브랜드와 무관한 기존 의미색이라 대상 제외. */
.course-header h1 { font-family: var(--ksk-font); font-size: var(--ksk-fs-h2); font-weight: var(--ksk-fw-h2); color: var(--ksk-heading-ink); }
.course-lede { color: var(--ksk-text-muted); }
.course-editor { border-color: var(--ksk-border); background: var(--ksk-page-bg); }
.course-title-row button, .course-action:not(.course-action--remove) { background: var(--ksk-brand); color: var(--ksk-page-bg); }
.course-notice { color: var(--ksk-text-muted); }
.course-item { border-color: var(--ksk-border); background: var(--ksk-page-bg); }
.course-item__meta { color: var(--ksk-text-muted); }
.course-distance { background: var(--ksk-brand-lighter); color: var(--ksk-heading-ink); }
.course-empty { border-color: var(--ksk-border); }
.course-empty p { color: var(--ksk-text-muted); }
@media (min-width: 1024px) {
  .course-shell { max-width: var(--ksk-desktop-max); }
  .course-items { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
}