/* NC Lab: Übersicht und Platzhalter. Farben aus dem NC Design System. */
:root {
  --nc-offwhite: #FCFDFF;
  --nc-offblack: #0A0A0A;
  --nc-pink: #D81E5B;
  --nc-pink-l: #FFBCE6;
  --nc-grey: #8A8F99;
  --line: #dfe2e8;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--nc-offwhite); color: var(--nc-offblack);
  font-family: "Space Grotesk", system-ui, sans-serif;
  padding: 48px 16px 80px; max-width: 880px; margin-inline: auto;
}
.label { font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: .08em; color: var(--nc-grey); }
h1 { font-size: 40px; font-weight: 600; margin: 8px 0 40px; }
section { margin-bottom: 32px; }
section .label { padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.row {
  display: grid; grid-template-columns: 180px 1fr auto; gap: 16px; align-items: baseline;
  padding: 14px 4px; border-bottom: 1px solid var(--line);
  color: inherit; text-decoration: none;
}
.row:hover { background: var(--nc-pink-l); }
.row:focus-visible { outline: 2px solid var(--nc-pink); outline-offset: 2px; }
.name { font-size: 18px; font-weight: 600; }
.desc { color: #444; font-size: 14px; }
.tag { font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--nc-pink); }
.tag.tbd { color: var(--nc-grey); }
.back { color: var(--nc-pink); text-decoration: none; font-family: "JetBrains Mono", monospace; font-size: 12px; }
.tbd-box { margin-top: 24px; padding: 32px; border: 1px dashed var(--line); color: var(--nc-grey); }
@media (max-width: 560px) {
  .row { grid-template-columns: 1fr auto; }
  .desc { grid-column: 1 / -1; grid-row: 2; }
}