/* 섬의 브랜드를 유지하는 자료 탐색 레이어: 잉크색 활자, 여백, 작은 발견. */
.funnel-ready .panel { background: #fffdfa; }
.funnel-ready .panel-place { font-family: var(--body); font-size: 14px; font-weight: 750; }
.fj-panel-tools { display: flex; gap: 5px; margin-left: auto; margin-right: 8px; }
.fj-panel-tools button { min-height: 44px; border: 0; border-radius: 5px; background: transparent; font: 600 11px var(--body); color: #677e91; padding: 6px 8px; cursor: pointer; }
.fj-panel-tools button:hover { background: #eff3f5; }
.fj-panel-tools span { display: inline-block; color: #36546b; padding-left: 3px; }
.funnel-ready .has-funnel > .lead { color: #5b6470; line-height: 1.75; }
.fj-eyebrow { margin: 22px 0 9px; color: #627487; font-size: 11px; font-weight: 750; letter-spacing: .13em; }
.zone .fj-title { font-family: var(--body); font-size: clamp(24px, 2.2vw, 30px); letter-spacing: -.045em; font-weight: 750; line-height: 1.45; white-space: pre-line; margin: 0 0 13px; color: #22384b; }
.fj-chooser { margin: 25px 0 22px; }
.zone .fj-chooser > h3 { font-family: var(--body); font-size: 14px; margin-bottom: 12px; }
.fj-choices { display: grid; gap: 8px; }
.fj-choices > button { display: flex; align-items: center; justify-content: space-between; gap: 16px; text-align: left; min-height: 58px; padding: 14px 16px; border: 1px solid #e4e8eb; border-radius: 9px; background: #fff; color: #283e50; font: 600 14px/1.55 var(--body); cursor: pointer; transition: border-color .15s, background .15s; }
.fj-choices > button span { flex: none; font-weight: 400; }
.fj-choices > button:hover, .fj-choices > button[aria-pressed=true] { border-color: #7d98ad; background: #f0f5f7; }
.fj-answer:empty { display: none; }
.fj-discovery { margin: 24px 0 18px; border-top: 1px solid #dbe3e8; padding-top: 2px; }
.zone .fj-discovery h3 { font-family: var(--body); font-size: 21px; font-weight: 720; line-height: 1.55; letter-spacing: -.035em; margin: 0 0 10px; }
.fj-discovery > p:not(.fj-eyebrow) { color: #5b6470; font-size: 14px; line-height: 1.8; }
.fj-scene { background: #eff4f6; border-radius: 9px; padding: 16px; margin: 20px 0; }
.fj-scene .fj-eyebrow { margin: 0 0 8px; }
.fj-scene h4 { font-size: 15px; line-height: 1.7; margin: 0 0 14px; }
.fj-scene > div { display: grid; gap: 8px; }
.fj-scene button { min-height: 44px; border: 1px solid #d8e1e7; border-radius: 6px; background: #fff; text-align: left; padding: 10px 12px; font: 500 13px/1.5 var(--body); color: #30495c; cursor: pointer; }
.fj-scene button[aria-pressed=true] { background: #30495c; color: #fff; border-color: #30495c; }
.fj-scene-answer { margin: 14px 0 0; font-size: 13px; line-height: 1.8; }
.fj-scene-answer:empty { display: none; }
.fj-section-label { margin: 24px 0 10px; font-size: 12px; font-weight: 750; color: #647284; }
.fj-recommendations, .fj-related, .fj-library-results { display: grid; gap: 10px; }
.fj-course { width: 100%; display: flex; flex-direction: column; position: relative; border: 1px solid #e3e8eb; border-radius: 8px; padding: 17px 38px 17px 16px; background: #fff; text-align: left; color: #263d4e; font-family: var(--body); cursor: pointer; }
.fj-course > span { font-size: 10px; color: #738192; font-weight: 650; margin-bottom: 8px; }
.fj-course > b { font-size: 15px; line-height: 1.55; font-weight: 700; }
.fj-course > small { font-size: 12px; color: #6a7580; line-height: 1.65; margin-top: 8px; }
.fj-course > i { position: absolute; right: 15px; top: 17px; font-style: normal; font-size: 17px; color: #718294; }
.fj-course:hover { border-color: #8fa4b5; background: #fafcfd; }
.fj-proof { width: 100%; margin-top: 15px; padding: 18px; display: grid; grid-template-columns: 1fr auto; gap: 5px 16px; background: #273f52; color: #fff; border: 0; border-radius: 8px; text-align: left; cursor: pointer; font-family: var(--body); }
.fj-proof small { color: #c0d1de; font-size: 11px; grid-column: 1; }
.fj-proof b { font-size: 14px; line-height: 1.6; font-weight: 600; grid-column: 1; }
.fj-proof span { grid-column: 2; grid-row: 1/3; align-self: center; font-size: 20px; }
.fj-textlink { display: inline-flex; align-items: center; gap: 8px; border: 0; background: transparent; padding: 7px 0; min-height: 44px; font: 650 13px/1.6 var(--body); color: #355771; cursor: pointer; text-align: left; text-decoration: none; }
.fj-textlink:hover { text-decoration: underline; text-underline-offset: 4px; }
.fj-more { margin: 25px 0 18px; border-top: 1px solid #e1e6e9; border-bottom: 1px solid #e1e6e9; }
.fj-more > summary { padding: 15px 4px; min-height: 48px; cursor: pointer; color: #4d6274; font: 650 13px/1.6 var(--body); }
.fj-more[open] { padding-bottom: 12px; }
.fj-course-link { width: 100%; padding: 0; display: block; border: 0; color: inherit; font: inherit; line-height: 1.65; text-align: left; background: transparent; cursor: pointer; }
.fj-open-label { display: block; color: #4d6b81; font-size: 11px; margin-top: 5px; }
.fj-course-link:hover .fj-open-label { text-decoration: underline; }
.fj-next { margin: 32px 0 0; padding: 4px 0 0; border-top: 1px solid #dce3e8; }
.zone .fj-next h3 { font-family: var(--body); font-size: 18px; margin: 0 0 15px; }
.fj-next-grid { display: grid; gap: 0; }
.fj-next-grid > button { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 12px 4px; border: 0; border-bottom: 1px solid #e9edef; background: transparent; text-align: left; color: #314b60; font-family: var(--body); cursor: pointer; }
.fj-next-grid small { color: #8b99a5; font-size: 11px; }
.fj-next-grid b { font-size: 13px; font-weight: 600; flex: 1; line-height: 1.6; }
.fj-next-grid button:hover b { text-decoration: underline; text-underline-offset: 4px; }
.fj-next > .fj-textlink { margin-top: 8px; }
.fj-dialog { width: min(600px, calc(100vw - 24px)); max-height: min(820px, calc(100dvh - 36px)); padding: 0; background: #fffdfa; border-radius: 14px; color: #263d4e; overflow: hidden; }
.fj-dialog[open] { display: flex; flex-direction: column; }
.fj-dialog::backdrop { background: rgba(20, 38, 55, .5); backdrop-filter: blur(4px); }
.fj-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 18px 10px 26px; border-bottom: 1px solid #e7ebee; }
.fj-dialog-head .fj-eyebrow { margin: 0; }
.fj-dialog-close { flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f0f3f5; color: #30495c; font-size: 25px; cursor: pointer; }
.fj-dialog-body { overflow: auto; padding: 23px 28px 28px; overscroll-behavior: contain; }
.fj-dialog h2 { font: 750 26px/1.55 var(--body); letter-spacing: -.045em; margin: 10px 0 14px; }
.fj-dialog h3 { font: 700 15px/1.65 var(--body); margin: 24px 0 12px; }
.fj-status { margin: 0; font-size: 11px; color: #637d90; font-weight: 600; }
.fj-problem { line-height: 1.85; color: #546573; font-size: 14px; }
.fj-audience { display: grid; gap: 7px; margin: 22px 0; padding: 14px 16px; background: #f1f5f7; font-size: 13px; line-height: 1.75; border-radius: 6px; }
.fj-audience b { font-size: 12px; }
.fj-objectives { list-style: none; padding: 0; margin: 0; }
.fj-objectives li { display: flex; align-items: flex-start; gap: 13px; margin: 13px 0; font-size: 14px; line-height: 1.75; }
.fj-objectives span { color: #8b9aaa; flex: none; font-size: 11px; padding-top: 4px; }
.fj-dialog .fj-more { font-size: 13px; line-height: 1.85; }
.fj-dialog .fj-more ul { padding-left: 18px; }
.fj-dialog .fj-more li { margin: 8px 0; }
.fj-insight { padding: 0 0 0 14px; border-left: 2px solid #8097aa; color: #516679; font-size: 13px; line-height: 1.8; }
.fj-course-actions { display: flex; gap: 8px; flex-wrap: wrap; margin: 26px 0 5px; }
.fj-course-actions .btn-main { background: #2c475c; color: #fff; }
.fj-notes { padding: 0 18px 18px; border: 1px solid #dce5eb; background: #f3f7f9; border-radius: 9px; margin: 24px 0; }
.fj-notes h3 { font-family: var(--body); font-size: 15px; line-height: 1.65; }
.fj-notes ul { list-style: none; margin: 0 0 15px; padding: 0; }
.fj-notes li { display: flex; gap: 12px; align-items: center; border-bottom: 1px solid #dce5eb; }
.fj-notes li .fj-textlink { flex: 1; }
.fj-remove { width: 44px; height: 44px; border: 0; background: transparent; color: #637889; font-size: 23px; cursor: pointer; }
.fj-notes .note { margin-bottom: 0; }
.fj-consult { margin: 22px 0; }
.fj-consult h3 { font-family: var(--body); font-size: 15px; }
.fj-consult > p { font-size: 13px; color: #667888; }
.fj-library { margin: 20px 0 30px; border-bottom: 1px solid #dce5eb; padding-bottom: 20px; scroll-margin-top: 12px; }
.fj-library h3 { font-family: var(--body); font-size: 20px; line-height: 1.6; margin: 0 0 15px; }
.fj-library-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; }
.fj-library-tabs button { border: 1px solid #dce4e9; border-radius: 6px; padding: 8px 11px; min-height: 44px; font: 600 12px var(--body); background: #fff; color: #5f7282; cursor: pointer; }
.fj-library-tabs button[aria-selected=true] { color: #fff; background: #2d485d; border-color: #2d485d; }
.fj-search-label { display: block; font-size: 11px; font-weight: 650; color: #687b8b; margin-bottom: 6px; }
#fj-search { width: 100%; min-height: 46px; background: #fff; border: 1px solid #d4dfe6; border-radius: 6px; padding: 10px 13px; font: 14px var(--body); color: #2a4053; }
.fj-result-count { font-size: 12px; color: #72808d; margin: 13px 0; }
.fj-review { padding: 17px 18px; margin: 0; background: #f6f4f0; border-radius: 6px; }
.fj-review > span, .fj-review > small { display: block; font-size: 10px; color: #7b7d7f; line-height: 1.6; }
.fj-review blockquote { padding: 0; margin: 10px 0; font: 500 14px/1.9 var(--body); color: #3d4e5c; white-space: pre-line; overflow-wrap: anywhere; }
.fj-inline-reviews { display: grid; gap: 10px; }
.voice-kw-list button { min-height: 44px; border: 1px solid #e1e6e9; border-radius: 6px; background: #fff; padding: 7px 11px; color: #4c6476; font: 13px var(--body); cursor: pointer; }
.voice-kw-list button b { font-size: 11px; margin-left: 8px; color: #7d8d99; }
.voice-kw-list button[aria-pressed=true] { background: #2d485d; color: #fff; border-color: #2d485d; }
.voice-kw-list button[aria-pressed=true] b { color: #d0dce5; }
.fj-resource { padding: 18px; border: 1px solid #e1e6e9; border-radius: 6px; }
.fj-resource .fj-eyebrow { margin: 0 0 8px; }
.fj-resource h4 { margin: 0 0 10px; font-size: 15px; line-height: 1.7; }
.fj-resource > p:not(.fj-eyebrow) { color: #667685; font-size: 13px; line-height: 1.8; }
.fj-resource > div { display: flex; gap: 18px; }
.fj-pages { display: flex; justify-content: center; align-items: center; gap: 18px; margin: 18px 0 10px; }
.fj-pages button { min-height: 44px; border: 1px solid #dbe4e9; border-radius: 5px; background: #fff; color: #4d6b82; font: 600 12px var(--body); padding: 8px 12px; cursor: pointer; }
.fj-pages button:disabled { opacity: .4; cursor: default; }
.fj-pages span { font-size: 12px; color: #708292; }
.fj-empty { padding: 20px 0; font-size: 14px; color: #6a7a88; }
.fj-video-focus { outline: 2px solid #7897ae; outline-offset: 5px; border-radius: 10px; }
.fj-video-next { padding: 16px; border-left: 2px solid #839cad; background: #f1f5f7; font-size: 13px; line-height: 1.8; }
.fj-lobby { padding: 15px 0 0; }
.fj-lobby h1 { font: 750 31px/1.45 var(--body); letter-spacing: -.055em; color: #253d50; margin: 6px 0 23px; }
.fj-lobby-photo { margin: 0 0 22px; }
.fj-lobby-photo img { display: block; width: 100%; max-height: 270px; object-fit: contain; background: #f1f4f5; border-radius: 8px; }
.fj-lobby-photo figcaption { margin-top: 9px; color: #607688; font-size: 11px; }
.fj-lobby > .btn-main { width: 100%; background: #2d485d; color: #fff; }
#funnel-entry { scroll-margin-top: 15px; padding-top: 22px; }
#funnel-entry h2 { font: 700 20px/1.6 var(--body); letter-spacing: -.035em; }
#funnel-entry .divisions { grid-template-columns: 1fr; }
#funnel-entry .divisions li button { border: 1px solid #e0e7ec; background: #fff; padding: 15px; min-height: 70px; border-radius: 7px; }
#funnel-entry .divisions li button b { font-family: var(--body); font-size: 14px; }
.fj-lobby-story { margin-top: 22px; }
.fj-lobby-story > summary { font-size: 12px; }
.fj-lobby-story .badges { margin-top: 18px; }
.fj-lobby-story p, .fj-lobby-story li { font-size: 13px; line-height: 1.8; }
.fj-course:focus-visible, .fj-choices button:focus-visible, .fj-scene button:focus-visible, .fj-textlink:focus-visible, .fj-next-grid button:focus-visible { outline: 3px solid #7896ac; outline-offset: 3px; }
[class^=fj-][hidden], #funnel-entry[hidden], #funnel-library[hidden] { display: none !important; }
@media (max-width: 760px) {
  .zone .fj-title { font-size: 24px; }
  .fj-dialog { max-height: calc(100dvh - 20px); width: calc(100vw - 18px); }
  .fj-dialog-body { padding: 19px; }
  .fj-dialog h2 { font-size: 23px; }
  .fj-dialog-head { padding-left: 19px; }
  .fj-lobby h1 { font-size: 28px; }
  .fj-lobby-photo img { max-height: 210px; }
  .fj-course-actions { display: grid; }
  .fj-choices > button { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .fj-choices > button { transition: none; } }
@media print { .fj-next, .fj-chooser, .fj-dialog, .fj-library, .fj-notes { display: none !important; } }

/* 2026-10-12 AI 과정 상세: 담당 강사 */
.fj-teacher { display: flex; align-items: center; gap: 10px; margin: 10px 0 4px; font-size: 14px; color: #425a6a; }
.fj-teacher img { flex: none; border-radius: 50%; object-fit: cover; }
.fj-teacher b { color: #172334; margin-right: 4px; }
.fj-teacher small { display: block; font-size: 12px; color: #667989; }