/* Packet-scoped chart layout. Integration must retain the .pc-page namespace. */
.pc-page { color: var(--ink); }
.pc-page *, .pc-page *::before, .pc-page *::after { box-sizing: border-box; }
.pc-page__board, .pc-page__mini { margin-block: 48px; padding: 24px; background: var(--slip); border: 1.5px solid var(--line-gold); border-radius: var(--r-surface); }
.pc-page__board-head { max-width: 680px; }
.pc-page__board-head h2 { margin: 0; color: var(--ink); font-size: clamp(1.5rem, 3vw, 1.9rem); font-weight: 700; line-height: var(--lh-heading); }
.pc-page__board-head p:not(.pc-page__eyebrow) { margin: 8px 0 0; color: var(--ink-soft); font-size: 1rem; line-height: var(--lh-body); }
.pc-page__eyebrow { margin: 0 0 6px; color: var(--ink-meta); font-size: .8125rem; font-weight: 700; line-height: var(--lh-ui); }
.pc-page__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; margin-block: 32px 20px; }
.pc-page__figure { width: min(100%, 300px); margin: 0 auto; }
.pc-page__figure--single { margin-block: 32px 20px; }
.pc-page__pie { display: block; width: min(100%, 280px); height: auto; margin-inline: auto; overflow: visible; }
.pc-page__figure figcaption { margin-top: 10px; color: var(--ink); font-size: .9375rem; font-weight: 600; line-height: var(--lh-body); text-align: center; }
.pc-page__legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-block: 20px; }
.pc-page__key { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); font-size: .9375rem; line-height: var(--lh-ui); }
.pc-page__key-swatch { display: block; width: 20px; height: 20px; flex: 0 0 20px; }
.pc-page__table-wrap { overflow-x: auto; border: 1px solid var(--line-gold); background: var(--white); }
.pc-page__table-wrap:focus-visible { outline: 3px solid var(--highlighter); outline-offset: 3px; }
.pc-page__table { width: 100%; min-width: 360px; border-collapse: collapse; color: var(--ink); font-size: 1rem; line-height: var(--lh-body); }
.pc-page__table caption { padding: 12px 16px; color: var(--ink-soft); font-size: .875rem; text-align: right; caption-side: top; }
.pc-page__table th, .pc-page__table td { padding: 12px 16px; border-block-start: 1px solid var(--paper-rule); text-align: right; }
.pc-page__table thead th { color: var(--ink); font-weight: 700; background: var(--paper); }
.pc-page__table tbody th { font-weight: 600; }
@media (max-width: 599px) { .pc-page__board, .pc-page__mini { padding: 20px 16px; } .pc-page__pair { grid-template-columns: 1fr; gap: 32px; } .pc-page__figure { width: min(100%, 280px); } .pc-page__legend { gap: 8px 12px; } .pc-page__table { min-width: 0; table-layout: fixed; } .pc-page__table th, .pc-page__table td { padding: 10px 12px; } }
@media print { .pc-page__board, .pc-page__mini { break-inside: avoid; margin-block: 18pt; background: var(--white); } .pc-page__pair { gap: 12pt; margin-block: 14pt; } .pc-page__pie { width: 190pt; } .pc-page__table-wrap { overflow: visible; } .pc-page__table { min-width: 0; font-size: 10pt; } }
@media (prefers-reduced-motion: reduce) { .pc-page *, .pc-page *::before, .pc-page *::after { scroll-behavior: auto; transition: none !important; animation: none !important; } }
