/* Paths page (D-021). Colours come from the path_graph legend at draw time. */
.pp-page { max-width: 1400px; margin: 0 auto; padding: 1rem; color: var(--text-primary, #f8f9fa); }
.pp-page h1 { margin: .5rem 0; }
.pp-lead { max-width: 900px; color: var(--text-secondary, #adb5bd); }
.pp-lead .pp-gold, .pp-gold { color: var(--accent-gold, #ffd93d); font-weight: 600; }
.pp-toolbar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .75rem 0; }
.pp-toggle { display: inline-flex; border: 1px solid var(--border-accent, #4a4f6a); border-radius: 6px; overflow: hidden; }
.pp-toggle button, .pp-toolbar .pp-zoom button, .pp-btn {
  background: var(--glass-bg, rgba(26,31,58,.8)); color: inherit; border: 1px solid var(--border-accent, #4a4f6a);
  padding: .3rem .8rem; cursor: pointer; font: inherit; text-decoration: none; border-radius: 4px; display: inline-block; }
.pp-toggle button { border: 0; border-radius: 0; }
.pp-toggle button[aria-pressed="true"] { background: var(--accent-gold, #ffd93d); color: #1a1a1a; }
.pp-btn { background: var(--accent-gold, #ffd93d); color: #1a1a1a; border-color: transparent; }
.pp-btn-secondary { background: transparent; color: inherit; border-color: var(--border-accent, #4a4f6a); }
.pp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 1rem; align-items: start; }
.pp-graph { border: 1px solid var(--border-primary, #2a2f4a); border-radius: 8px; background: #0d1130; }
#pp-svg { display: block; width: 100%; height: 62vh; min-height: 360px; touch-action: none; cursor: grab; }
#pp-svg:focus-visible, .pp-node:focus-visible { outline: 2px solid var(--accent-gold, #ffd93d); }
.pp-node { cursor: pointer; }
.pp-node:focus-visible rect, .pp-node.is-selected rect { stroke-width: 4; filter: drop-shadow(0 0 4px #ffffff88); }
.pp-inspector { border: 1px solid var(--border-primary, #2a2f4a); border-radius: 8px; padding: 1rem;
  background: var(--glass-bg, rgba(26,31,58,.8)); max-height: 72vh; overflow: auto; }
.pp-inspector h2 { margin-top: 0; font-size: 1.2rem; }
.pp-sec h3 { font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-secondary, #adb5bd); margin: .8rem 0 .25rem; }
.pp-sec p, .pp-sec li { font-size: .95rem; line-height: 1.45; }
.pp-tag { display: inline-block; padding: .1rem .6rem; border: 1px solid var(--border-accent, #4a4f6a); border-radius: 999px; font-size: .8rem; }
.pp-notice { padding: .5rem .75rem; border-left: 3px solid var(--accent-gold, #ffd93d); background: rgba(255,217,61,.08); }
.pp-error { color: #ff5c5c; }
.pp-kv { list-style: none; padding: 0; margin: 0; }
.pp-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0; }
.pp-table { width: 100%; border-collapse: collapse; font-size: .85rem; margin: .5rem 0; }
.pp-table th, .pp-table td { border-bottom: 1px solid var(--border-primary, #2a2f4a); padding: .25rem .4rem; text-align: left; vertical-align: top; }
.pp-pathlist { margin-top: 1.25rem; }
#pp-search { width: 100%; max-width: 420px; padding: .4rem .6rem; background: transparent; color: inherit;
  border: 1px solid var(--border-accent, #4a4f6a); border-radius: 4px; font: inherit; }
#pp-list, #pp-list ul { list-style: none; padding: 0; margin: 0; }
.pp-group h3 { font-size: .9rem; margin: .8rem 0 .25rem; color: var(--text-secondary, #adb5bd); }
.pp-item { display: flex; justify-content: space-between; gap: .75rem; width: 100%; text-align: left; background: transparent;
  color: inherit; border: 1px solid transparent; border-bottom-color: var(--border-primary, #2a2f4a); padding: .35rem .5rem; cursor: pointer; font: inherit; }
.pp-item:hover, .pp-item.is-selected { background: rgba(139,127,255,.15); border-color: var(--accent, #8b7fff); }
.pp-item.is-main .pp-item-label { color: var(--accent-gold, #ffd93d); font-weight: 600; }
.pp-chip { font-size: .75rem; color: var(--text-secondary, #adb5bd); white-space: nowrap; }
@media (max-width: 800px) {
  .pp-layout { grid-template-columns: minmax(0, 1fr); }
  .pp-inspector { max-height: none; }
  #pp-svg { height: 50vh; }
}

/* Assessment panel (D-026) */
.pp-assess { margin-top: 1.25rem; }
.pp-assess-scroll { overflow-x: auto; max-width: 100%; margin-bottom: 1rem; }
.pp-assess-scroll .pp-table { min-width: 44rem; }
.pp-assess h3 { font-size: 1rem; margin: .75rem 0 .25rem; }
.pp-assess tr.pp-cand td { background: rgba(255, 217, 61, .14); font-weight: 600; }
.pp-assess .pp-fit { color: #ff9f43; }
.pp-assess .pp-quiet { opacity: .75; font-size: .85rem; }

/* Reasonable alternatives glow in their own colour, distinct from the gold path (V1). */
:root { --pp-reasonable: #c77dff; --pp-reasonable-glow: #c77dffcc; }
.pp-node.pp-reasonable rect { stroke: var(--pp-reasonable); stroke-width: 3; filter: drop-shadow(0 0 6px var(--pp-reasonable-glow)); }
.pp-reasonable-edge { stroke: var(--pp-reasonable); opacity: .85; filter: drop-shadow(0 0 4px var(--pp-reasonable-glow)); }
.pp-legend { list-style: none; display: flex; flex-wrap: wrap; gap: 1rem; margin: .5rem 0; padding: 0; color: var(--text-secondary, #adb5bd); }
.pp-key { display: inline-flex; align-items: center; gap: .4rem; }
.pp-swatch { width: .9rem; height: .9rem; border-radius: 3px; border: 2px solid var(--accent-gold, #ffd93d); display: inline-block; }
.pp-key-reasonable .pp-swatch { border-color: var(--pp-reasonable); box-shadow: 0 0 6px var(--pp-reasonable-glow); }
/* The glow is static: nothing pulses, and reduced motion removes any transition. */
@media (prefers-reduced-motion: reduce) { .pp-node, .pp-reasonable-edge { transition: none; animation: none; } }