/* /cliff/ 절벽구간 자료 페이지 전용 — tv.css(밝은 톤) 위에 얹는 구간 띠·차트 보정 */
.kicker { display: block; font-size: 15px; font-weight: 600; color: var(--accent); padding-top: 40px; }
.kicker + h2.sec { padding-top: 6px; font-size: clamp(24px, 3.2vw, 32px); display: block; }
.kicker + h2.sec small { display: block; font-size: 14.5px; padding-top: 8px; max-width: 720px; line-height: 1.6; }

/* 남색 띠: 본문 폭 안에 있지만 화면 끝까지 칠함 */
.band { position: relative; color: #adbdcc; padding: 8px 0 48px; margin: 0; background: var(--text); box-shadow: 0 0 0 100vmax var(--text); clip-path: inset(0 -100vmax); }
.band .kicker { color: #80e9ff; }
.band h2.sec { color: #fff; } .band h2.sec small { color: #adbdcc; }
.band .card { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); box-shadow: none; }
.band .card h4 { color: #fff; } .band .card p { color: #adbdcc; } .band .card .k { color: #80e9ff; }
.band .toc a { background: rgba(255,255,255,.08); color: #fff !important; } .band .toc a:hover { background: rgba(255,255,255,.16); color: #fff !important; }

.panel { border-radius: 14px; padding: 22px; background: var(--panel); border: 1px solid var(--border); box-shadow: var(--sh); }
.caveat { background: #fff8eb !important; color: #6b4a12 !important; border-left-color: #e0a020 !important; }
.toc a { border: 0 !important; background: var(--panel-2); color: var(--text) !important; font-weight: 600; font-size: 13px; padding: 7px 13px !important; }
.toc a:hover { background: #ebe9ff; color: var(--accent) !important; }
.ctip, .bar .tip { background: var(--tipbg) !important; color: #fff !important; border: 0 !important; box-shadow: var(--sh-lg); }
.bar .bt { background: var(--panel-2); border-radius: 4px; }
.bar .bt i { background: linear-gradient(90deg, #635bff, #00d4ff) !important; border-radius: 4px; opacity: 1 !important; }
.pick button { border-color: var(--border-2) !important; color: var(--muted) !important; background: #fff; }
.pick button[aria-pressed="true"] { color: #fff !important; background: var(--accent) !important; border-color: var(--accent) !important; }
.chart .fg circle { stroke: #fff !important; }
.figs figure { background: var(--panel) !important; border: 1px solid var(--border) !important; box-shadow: var(--sh); }
.figs img { border-bottom: 1px solid var(--border); }
details.ld { background: var(--panel) !important; border: 1px solid var(--border) !important; box-shadow: var(--sh); }
details.ld .sv { font-family: inherit !important; }
.tw .w { font-family: inherit !important; background: var(--panel-2); border: 0 !important; }
@media (max-width: 700px) {
  table.t.mt td:first-child, table.t.mt th:first-child { background: #fff; }
  .kicker { padding-top: 28px; }
}
@media (horizontal-viewport-segments: 2), (vertical-viewport-segments: 2) { .band { box-shadow: none; clip-path: none; padding-left: 16px; padding-right: 16px; border-radius: 14px; } }
