/* The NYC event graph surface (nyc.drng.vc): its chrome and the controls its pages share.
   Page stylesheets in this folder add the rules only one page needs. */
.nyc-skip { position: absolute; left: 16px; top: 16px; z-index: 10; padding: 8px 16px; background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); transform: translateY(-200%); }
.nyc-skip:focus-visible { transform: none; }

.nyc-bar { justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; border-bottom: 1px solid var(--border); }
.nyc-lockup { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; color: var(--fg); text-decoration: none; }
.nyc-lockup-name { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.02em; white-space: nowrap; }
.nyc-lockup:hover .nyc-lockup-name { color: var(--accent); }
.nyc-nav { display: flex; flex-wrap: wrap; gap: 0 4px; font-size: 0.8125rem; }
.nyc-nav-link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; color: var(--label); text-decoration: none; }
.nyc-nav-link:hover { color: var(--accent); }
.nyc-nav-link[aria-current='page'] { color: var(--fg); box-shadow: inset 0 -2px 0 var(--accent); }
.nyc-content { flex: 1 0 auto; outline: none; display: flex; flex-direction: column; }

/* The footer: the tag and its links on one row, the note on its own full-width line under them. */
.nyc-foot { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 48px; padding-top: 24px; padding-bottom: 32px; border-top: 1px solid var(--border); }
.nyc-foot-nav { display: flex; flex-wrap: wrap; gap: 0 4px; margin-right: -8px; font-size: 0.75rem; }
.nyc-foot-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; }
.nyc-foot-note { flex: 1 0 100%; font-size: 0.75rem; line-height: 1.6; color: var(--muted); }

.nyc-crumb { font-size: 0.75rem; color: var(--muted); }
.nyc-crumb a { color: var(--muted); }
.nyc-crumb a:hover { color: var(--accent); }
.nyc-crumb-sep { margin: 0 10px; color: var(--input); }

.nyc-main { width: 100%; max-width: calc(var(--page) + 32px); padding-top: clamp(2rem, 6vw, 3.5rem); padding-bottom: 96px; }
.nyc-title { font-size: clamp(1.625rem, 3.5vw, 2.25rem); line-height: 1.15; margin-bottom: 12px; text-wrap: balance; }
.nyc-main h2 { font-size: 1rem; margin: 32px 0 12px; }
.nyc-main .lede { max-width: 46rem; }
.nyc-label { font-size: 0.6875rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.nyc-main .nyc-heading-rule { margin: 0 0 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border); font-size: 0.6875rem; font-weight: 400; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.nyc-data { font-variant-numeric: tabular-nums; font-size: 0.75rem; }
.nyc-num { font-variant-numeric: tabular-nums; }
.nyc-absent { color: var(--placeholder); }
.nyc-asof { font-size: 0.75rem; color: var(--muted); margin-top: 8px; }
.nyc-sep { color: var(--input); }

.nyc-badge { display: inline-flex; align-items: center; min-height: 22px; padding: 0 8px; border-radius: var(--radius); font-size: 0.6875rem; line-height: 1.2; letter-spacing: 0.02em; border: 1px solid var(--border); color: var(--label); white-space: nowrap; }
.nyc-badge-secondary { background: var(--card); }
.nyc-badge-accent { border-color: transparent; background: var(--accent-soft); color: var(--accent); }
.nyc-badge-topic { border-color: transparent; background: var(--accent-soft); color: var(--accent); }
.nyc-badges { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }

/* Buttons keep one line while they fit and wrap evenly only when the text cannot, as at 200% text. */
.nyc-main .btn { max-width: 100%; white-space: normal; text-align: center; text-wrap: balance; padding-top: 8px; padding-bottom: 8px; }
.btn-sm { min-height: 32px; padding: 0 12px; font-size: 0.75rem; }
.btn[disabled].btn-sm, .btn-secondary[disabled] { opacity: 0.45; cursor: default; }

.nyc-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--border); }
.nyc-pagination-links { display: flex; gap: 8px; }

/* Filter toolbars on /events and /funds: a GET form whose menus open without script. */
.nyc-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 32px; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); }
.nyc-toolbar-rule { width: 1px; height: 28px; background: var(--border); }
.nyc-toolbar-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: auto; }
.nyc-segmented { display: inline-flex; flex-wrap: wrap; margin: 0; padding: 3px; min-width: 0; border: 1px solid var(--border); border-radius: var(--radius); }
.nyc-segmented legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nyc-segment { position: relative; display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border-radius: 3px; font-size: 0.8125rem; color: var(--label); cursor: pointer; text-decoration: none; }
.nyc-segment input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.nyc-segment:hover { color: var(--fg); background: var(--hover); }
.nyc-segment:has(:checked), .nyc-segment[aria-current='true'] { background: var(--fg); color: var(--bg); }
.nyc-segment:has(:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }

.nyc-menu { position: relative; }
.nyc-menu > summary { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border: 1px solid rgba(250, 246, 235, 0.3); border-radius: var(--radius); font-size: 0.8125rem; cursor: pointer; list-style: none; }
.nyc-menu > summary::-webkit-details-marker { display: none; }
.nyc-menu > summary::after { content: ''; width: 6px; height: 6px; margin-left: 2px; border-right: 1.5px solid var(--muted); border-bottom: 1.5px solid var(--muted); transform: translateY(-2px) rotate(45deg); }
.nyc-menu[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
.nyc-menu > summary:hover, .nyc-menu[open] > summary, .nyc-menu-set > summary { border-color: var(--accent); }
.nyc-menu-count { font-size: 0.75rem; color: var(--accent); font-variant-numeric: tabular-nums; }
.nyc-menu-panel { position: absolute; top: calc(100% + 6px); left: 0; z-index: 5; width: max-content; min-width: 16rem; max-width: min(28rem, calc(100vw - 32px)); max-height: 22rem; overflow-y: auto; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius); background: #121311; }

.nyc-chips-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.nyc-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 10px; border-radius: var(--radius); background: var(--accent-soft); color: var(--accent); font-size: 0.75rem; text-decoration: none; }
.nyc-chip::after { content: '\00d7'; font-size: 0.875rem; }
.nyc-chip:hover { background: var(--accent-hover); }

.nyc-group { border: 0; padding: 0; margin: 0; min-width: 0; }
.nyc-legend { display: block; font-size: 0.6875rem; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; padding: 0; }
.nyc-choices { display: flex; flex-direction: column; gap: 2px; margin-left: -4px; }
.nyc-choice { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 4px 8px 4px 4px; border-radius: var(--radius); cursor: pointer; font-size: 0.8125rem; color: var(--fg); }
.nyc-choice:hover { background: var(--hover); }
.nyc-choice:has(:checked) { color: var(--accent); }
.nyc-control { margin: 0; accent-color: var(--accent); width: 16px; height: 16px; flex: none; }
.nyc-menu-panel .nyc-legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
.nyc-menu-panel .nyc-choices { margin-left: 0; }
.nyc-field { display: flex; flex-direction: column; gap: 6px; }
.nyc-field .nyc-legend { margin-bottom: 0; }

.nyc-empty, .nyc-alert { border: 1px dashed rgba(250, 246, 235, 0.3); border-radius: var(--radius); padding: 32px; }
.nyc-alert { border-style: solid; border-color: var(--border); border-left: 3px solid var(--dot); padding: 28px 24px; }
.nyc-empty-title, .nyc-alert-title { font-size: 1rem; }
.nyc-empty .muted, .nyc-alert .muted { max-width: 36rem; margin-top: 6px; line-height: 1.6; }
.nyc-empty-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }

/* Content lines up with the header and footer, whose gutter is 32px on wide screens and 16px below 1000px. */
@media (min-width: 1000px) {
  .nyc-main { max-width: calc(var(--page) + 64px); padding-left: 32px; padding-right: 32px; }
}
@media (max-width: 999px) {
  .nyc-bar { padding-top: 12px; padding-bottom: 12px; }
}
@media (max-width: 639px) {
  .nyc-toolbar-rule { display: none; }
  .nyc-toolbar-actions { margin-left: 0; width: 100%; }
  .nyc-menu { position: static; }
  .nyc-menu-panel { left: 12px; right: 12px; width: auto; min-width: 0; max-width: none; }
  .nyc-toolbar { position: relative; }
}
input[type='search'] { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid var(--input); border-radius: var(--radius); background: var(--field); color: var(--fg); font: inherit; font-size: 0.875rem; }
input[type='search']:focus-visible { outline: none; border-color: var(--accent); }