/* COPYCAT notes: page-local additions to the shared notes components. */
.cc-levels { max-width: 480px; }
.cc-levels img { height: auto; }
.cc-judge { margin-bottom: 22px; }
.cc-judge figcaption { color: var(--fg-3); font-size: var(--t-2xs); margin-bottom: 12px; }
.cc-judge .tr::after { content: ""; position: absolute; left: 50%; top: -4px; bottom: -4px; border-left: 1px solid var(--fg-2); }
.cc-judge .lanes-ax span.mid { display: block; }
.cc-payload { display: grid; grid-template-columns: 21fr 8fr; margin: 6px 0 22px; border: 1px solid var(--line-2); border-radius: 10px; overflow: hidden; }
.cc-payload > div { padding: 16px; min-width: 0; background: var(--bg-2); }
.cc-payload > div + div { border-left: 1px solid var(--line-2); background: color-mix(in srgb, var(--prog) 10%, var(--bg-2)); }
.cc-payload strong { display: block; font: 650 1.8rem/1.2 var(--f-display); color: var(--fg); }
.cc-payload span { color: var(--fg-2); font-size: .85rem; }
.cc-payload small { display: block; margin-top: 6px; color: var(--fg-3); font: 450 var(--t-2xs)/1.5 var(--f-mono); }
.cc-payload figcaption { grid-column: 1 / -1; border-top: 1px solid var(--line); padding: 9px 12px; color: var(--fg-3); font-size: var(--t-2xs); }
.nt-page .cc-code { white-space: pre-wrap; overflow-wrap: anywhere; }
.nt-page .cc-table { max-width: 100%; }
.cc-table th, .cc-table td { overflow-wrap: anywhere; }
.cc-table .cc-num { white-space: nowrap; }
#checks .cc-table td:first-child { white-space: nowrap; }
.nt-page .nt-end .textlink { overflow-wrap: anywhere; }
@media (max-width: 480px) {
  .cc-table th, .cc-table td { padding: 9px 8px; font-size: .8rem; }
  .cc-judge .ln { grid-template-columns: 112px minmax(0, 1fr); }
  .cc-judge .ln > span { font-size: 9px; letter-spacing: 0; white-space: nowrap; }
  .cc-judge .lanes-ax { margin-left: 120px; }
  .cc-payload > div { padding: 12px; }
  .cc-payload { grid-template-columns: 2fr 1fr; }
}

.strips .lg { white-space: nowrap; display: inline-block; margin-right: 8px; }
