/* NCI-owned reconstruction of the established three-panel design language. */
section.ncli-panel { --ncli-max: 48rem; --ncli-bg: #fff; --ncli-ink: #111; --ncli-muted: #555; --ncli-rule: #b7b7b7; --ncli-surface: #eee; --ncli-hover: #eee; --ncli-accent: #111; --ncli-on-accent: #fff; --ncli-radius: 0; --ncli-frame-border: 1px solid var(--ncli-ink); --ncli-frame-pad: 1.5rem; --ncli-body-font: Arial, Helvetica, sans-serif; --ncli-head-font: Georgia, serif; --ncli-head-weight: 400; box-sizing: border-box; display: block; width: 100%; max-width: var(--ncli-max); margin: 2rem auto; padding: 0; border: 0; border-radius: var(--ncli-radius); background: var(--ncli-bg); color: var(--ncli-ink); font-family: var(--ncli-body-font); font-size: 16px; line-height: 1.5; text-align: left; }
section.ncli-panel *, section.ncli-panel *::before, section.ncli-panel *::after { box-sizing: border-box; }
section.ncli-panel--minimal { --ncli-ink: #1f2937; --ncli-muted: #6b7280; --ncli-rule: #e5e7eb; --ncli-surface: #f3f4f6; --ncli-hover: #f3f4f6; --ncli-accent: #2563eb; --ncli-radius: 14px; --ncli-frame-border: 0; --ncli-frame-pad: 1.25rem; --ncli-body-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --ncli-head-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --ncli-head-weight: 650; }
section.ncli-panel--dark { --ncli-bg: #0f1115; --ncli-ink: #e8eaed; --ncli-muted: #9aa3b2; --ncli-rule: #2d3340; --ncli-surface: #1a1e27; --ncli-hover: #222836; --ncli-accent: #7dd3fc; --ncli-on-accent: #0b1220; --ncli-radius: 12px; --ncli-frame-border: 1px solid var(--ncli-rule); --ncli-frame-pad: 1.5rem; --ncli-body-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --ncli-head-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --ncli-head-weight: 650; }
.ncli-panel .screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); border: 0; white-space: nowrap; }
.ncli-panel__frame { margin: 0; padding: var(--ncli-frame-pad); border: var(--ncli-frame-border); border-radius: var(--ncli-radius); background: transparent; }
.ncli-panel__header { margin: 0; padding: 0 0 1rem; border-bottom: 1px solid var(--ncli-rule); }
.ncli-panel__title { margin: 0; padding: 0; color: var(--ncli-ink); font: var(--ncli-head-weight) clamp(1.75rem, 4.5vw, 2.75rem)/1.08 var(--ncli-head-font); }
.ncli-panel__headline { margin: .5rem 0 0; color: var(--ncli-ink); font: 400 .95rem/1.45 var(--ncli-body-font); }
.ncli-panel__introduction { margin: .75rem 0 0; color: var(--ncli-muted); font: 400 .95rem/1.5 var(--ncli-body-font); }
.ncli-panel__form { margin: 1.25rem 0 0; padding: 0; }
.ncli-panel__transcript:empty, .ncli-panel__status:empty { display: none; }
.ncli-panel__input-shell { display: flex; gap: .5rem; min-height: 48px; }
.ncli-panel textarea { flex: 1; min-width: 0; min-height: 48px; margin: 0; padding: .75rem; resize: vertical; border: 1px solid var(--ncli-rule); border-radius: var(--ncli-radius); background: var(--ncli-bg); box-shadow: none; color: var(--ncli-ink); font: inherit; font-size: 1rem; line-height: 1.4; }
.ncli-panel textarea::placeholder { color: var(--ncli-muted); opacity: 1; }
.ncli-panel textarea:focus { outline: 3px solid var(--ncli-focus, var(--ncli-accent)); outline-offset: -3px; border-color: var(--ncli-focus, var(--ncli-accent)); }
.ncli-panel button[type="submit"] { flex: 0 0 48px; min-height: 48px; margin: 0; padding: 0; border: 0; border-radius: var(--ncli-radius); background: var(--ncli-accent); box-shadow: inset 0 0 0 1px var(--ncli-edge, transparent); color: var(--ncli-on-accent); font-size: 1.2rem; line-height: 1; cursor: pointer; }
.ncli-panel button[type="submit"]:hover, .ncli-panel button[type="submit"]:focus-visible { filter: brightness(1.15); outline: 3px solid var(--ncli-focus, var(--ncli-accent)); outline-offset: 2px; }
.ncli-panel button:disabled, .ncli-panel textarea:disabled { opacity: .55; cursor: not-allowed; }
.ncli-panel__reset { display: inline-block; margin: .75rem 0 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--ncli-ink); font: 700 .72rem/1 var(--ncli-body-font); letter-spacing: .08em; text-decoration: underline; text-transform: uppercase; cursor: pointer; }
.ncli-panel__reset[hidden] { display: none; }
.ncli-panel__status { max-width: 46rem; margin: .75rem 0 0; color: var(--ncli-muted); font-size: .95rem; line-height: 1.5; }
.ncli-panel__transcript { overflow: visible; margin: 1.25rem 0 0; }
.ncli-panel__turn { display: grid; gap: .6rem; margin: 0 0 .9rem; padding: 0; border: 0; background: transparent; color: var(--ncli-ink); font-size: .95rem; line-height: 1.5; scroll-margin-bottom: 1rem; }
.ncli-panel__question { margin: 0; padding: .85rem 1rem; border: 1px solid var(--ncli-q-rule, var(--ncli-rule)); border-radius: var(--ncli-radius); background: var(--ncli-q-bg, var(--ncli-surface)); color: var(--ncli-q-ink, var(--ncli-ink)); font-weight: 400; overflow-wrap: anywhere; }
.ncli-panel__answer { margin: 0; padding: 1rem; border: 1px solid var(--ncli-a-rule, var(--ncli-rule)); border-radius: var(--ncli-radius); background: var(--ncli-a-bg, var(--ncli-bg)); color: var(--ncli-a-ink, inherit); overflow-wrap: anywhere; }
.ncli-panel__answer--pending { color: var(--ncli-muted); }
.ncli-panel__answer > :first-child { margin-top: 0; }
.ncli-panel__answer > :last-child { margin-bottom: 0; }
.ncli-panel__answer { line-height: 1.6; }
.ncli-panel__answer p { max-width: 68ch; margin: .6rem 0; }
.ncli-panel__answer h3, .ncli-panel__answer h4, .ncli-panel__answer h5, .ncli-panel__answer h6 { margin: 1.15rem 0 .4rem; color: var(--ncli-a-ink, var(--ncli-ink)); font-family: var(--ncli-head-font); font-weight: var(--ncli-head-weight); line-height: 1.25; }
.ncli-panel__answer h3 { font-size: 1.2rem; }
.ncli-panel__answer h4 { font-size: 1.08rem; }
.ncli-panel__answer h5 { margin-top: 1rem; font-family: var(--ncli-body-font); font-size: 1rem; font-weight: 700; }
.ncli-panel__answer h6 { margin-top: 1rem; font-family: var(--ncli-body-font); font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ncli-panel__answer h3 + p, .ncli-panel__answer h4 + p, .ncli-panel__answer h5 + p, .ncli-panel__answer h6 + p, .ncli-panel__answer h3 + ul, .ncli-panel__answer h4 + ul, .ncli-panel__answer h3 + ol, .ncli-panel__answer h4 + ol { margin-top: 0; }
.ncli-panel__answer ul, .ncli-panel__answer ol { max-width: 68ch; margin: .6rem 0; padding-left: 1.5rem; }
.ncli-panel__answer li { padding-left: .15rem; }
.ncli-panel__answer li + li { margin-top: .25rem; }
.ncli-panel__answer li::marker { color: var(--ncli-muted); }
.ncli-panel__answer li > p { margin: .25rem 0; }
.ncli-panel__answer li > ul, .ncli-panel__answer li > ol { margin: .3rem 0 .1rem; padding-left: 1.25rem; }
.ncli-panel__answer ul { list-style: disc; }
.ncli-panel__answer ul ul { list-style: circle; }
.ncli-panel__answer ul ul ul { list-style: square; }
.ncli-panel__answer ol { list-style: decimal; }
.ncli-panel__answer ol ol { list-style: lower-alpha; }
.ncli-panel__answer ol ol ol { list-style: lower-roman; }
.ncli-panel__answer strong, .ncli-panel__answer b { font-weight: 700; }
.ncli-panel__answer em, .ncli-panel__answer i { font-style: italic; }
.ncli-panel__answer blockquote { max-width: 68ch; margin: .85rem 0; padding: .15rem 0 .15rem 1rem; border-left: 3px solid var(--ncli-accent); color: var(--ncli-muted); }
.ncli-panel__answer blockquote p { margin: .4rem 0; }
.ncli-panel__answer pre { overflow-x: auto; margin: .85rem 0; padding: .75rem .85rem; border: 1px solid var(--ncli-rule); border-radius: calc(var(--ncli-radius) / 2); background: rgba(127, 127, 127, .12); font: .85em/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; }
.ncli-panel__answer code { padding: .1em .3em; border-radius: 3px; background: rgba(127, 127, 127, .18); font: .88em ui-monospace, SFMono-Regular, Consolas, monospace; overflow-wrap: anywhere; }
.ncli-panel__answer pre code { padding: 0; background: transparent; }
.ncli-panel__answer .ncli-panel__answer-label { margin: 1.1rem 0 .3rem; font-size: 1.02rem; line-height: 1.3; }
.ncli-panel__answer > .ncli-panel__answer-label:first-child { margin-top: 0; }
@media (max-width: 400px) {
.ncli-panel__answer { padding: .85rem; line-height: 1.55; }
.ncli-panel__answer h3 { font-size: 1.1rem; }
.ncli-panel__answer h4 { font-size: 1.02rem; }
.ncli-panel__answer ul, .ncli-panel__answer ol { padding-left: 1.25rem; }
.ncli-panel__answer li > ul, .ncli-panel__answer li > ol { padding-left: 1rem; }
.ncli-panel__answer blockquote { padding-left: .75rem; }
.ncli-panel__answer pre { padding: .6rem; font-size: .8em; }
}
.ncli-panel__answer hr { margin: .9rem 0; border: 0; border-top: 1px solid var(--ncli-rule); }
.ncli-panel__footer { display: flex; justify-content: space-between; gap: 1rem; margin: 1.25rem 0 0; padding: .75rem 0 0; border-top: 1px solid var(--ncli-rule); color: var(--ncli-muted); font: 700 .72rem/1.35 var(--ncli-body-font); letter-spacing: .08em; text-transform: uppercase; }
.ncli-panel__credit { margin: .6rem 0 0; color: var(--ncli-muted); font: 400 .78rem/1.4 var(--ncli-body-font); text-align: right; }
.ncli-panel__credit a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.ncli-panel__credit a:focus-visible { outline: 3px solid var(--ncli-focus, var(--ncli-accent)); outline-offset: 2px; }
.ncli-limit-notice { max-width: var(--ncli-max); margin: 1rem auto; color: #3c434a; font-size: .95rem; }
@media (max-width: 600px) { .ncli-panel__frame { padding: 1.25rem; } .ncli-panel__footer { flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .ncli-panel *, .ncli-panel *::before, .ncli-panel *::after { scroll-behavior: auto; transition: none !important; } }
.ncli-panel__sources { margin-top: .85rem; padding-top: .65rem; border-top: 1px solid var(--ncli-rule); font-size: .9em; }
.ncli-panel__sources-title { margin: 0 0 .3rem; font-weight: 600; color: var(--ncli-muted); }
.ncli-panel__sources-list { margin: 0; padding-left: 1.2rem; }
.ncli-panel__sources-list li { margin: .2rem 0; }
.ncli-panel__sources-list a { overflow-wrap: anywhere; }
.ncli-panel__working { display: inline-flex; align-items: center; gap: .55rem; }
.ncli-panel__working-dots { display: inline-flex; gap: .25rem; }
.ncli-panel__working-dots span { width: .4rem; height: .4rem; border-radius: 50%; background: currentColor; opacity: .3; animation: ncli-working 1.2s ease-in-out infinite; }
.ncli-panel__working-dots span:nth-child(2) { animation-delay: .2s; }
.ncli-panel__working-dots span:nth-child(3) { animation-delay: .4s; }
@keyframes ncli-working { 0%, 80%, 100% { opacity: .3; transform: scale(.85); } 40% { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .ncli-panel__working-dots span { animation: none; opacity: .65; } }
.ncli-panel__caret { display: inline-block; width: .5ch; height: 1em; margin-left: 2px; vertical-align: text-bottom; background: currentColor; opacity: .55; animation: ncli-caret 1s steps(2, start) infinite; }
@keyframes ncli-caret { to { visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .ncli-panel__caret { animation: none; } }