/* K# directory uses the existing shell, grid and typography tokens. */
body[data-route="navigator"] main.wrap { width:100%; max-width:none; padding-inline:clamp(16px, 2vw, 32px); }
.navigator-page { font-family:var(--f-font-sans, system-ui, sans-serif); min-width:0; }
.navigator-controls { display:grid; grid-template-columns:minmax(0, 1fr) minmax(160px, 240px); gap:16px; }
.navigator-controls label { display:grid; gap:8px; font-size:var(--f-size-04, 14px); }
.navigator-controls input, .navigator-controls select { box-sizing:border-box; width:100%; min-height:44px; padding:10px; border:1px solid var(--line); border-radius:8px; background:var(--nav-bg, #0e1830); color:var(--nav-text, #e7edf7); }
.navigator-controls p { grid-column:1 / -1; margin:0; }
.navigator-workspace { display:grid; grid-template-columns:minmax(0, 1.6fr) minmax(0, 1fr); gap:20px; margin-top:20px; align-items:start; }
.navigator-workspace .panel { min-width:0; }
.navigator-records { list-style:none; padding:0; display:grid; gap:8px; }
.navigator-records button { display:grid; gap:6px; width:100%; text-align:start; padding:14px; border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--nav-text, #e7edf7); cursor:pointer; }
.navigator-records button:hover, .navigator-records button[aria-pressed="true"] { background:rgba(77,163,255,.12); border-color:var(--nav-active, #4da3ff); }
.navigator-records code, .navigator-detail dd { overflow-wrap:anywhere; }
.navigator-records code { font-family:var(--f-font-mono, monospace); color:var(--nav-active, #4da3ff); }
.navigator-records span { font-size:var(--f-size-03, 12px); color:var(--nav-muted, #aab7cf); }
.navigator-detail dl { display:grid; grid-template-columns:minmax(100px, .8fr) minmax(0, 1.2fr); gap:12px; }
.navigator-detail dd { margin:0; }
.navigator-detail dt { color:var(--nav-muted, #aab7cf); }
.navigator-open { display:inline-block; padding:12px 16px; border:1px solid var(--line); border-radius:8px; }
.navigator-page [hidden] { display:none; }
.navigator-page :focus-visible { outline:2px solid var(--nav-focus, #4da3ff); outline-offset:3px; }
@media (max-width:900px) { .navigator-workspace { grid-template-columns:1fr; } }
@media (max-width:767px) { .navigator-controls { grid-template-columns:1fr; } .navigator-detail dl { grid-template-columns:1fr; gap:8px; } .navigator-detail dd { margin-bottom:8px; } }

/* DGRID/NAVIGATOR V1 — full-bleed directory with an element-owned
 * KAP-GRID viewport. The browser document never becomes the scroll owner. */
html:has(body[data-route="navigator"]) { width:100%; height:100%; overflow:hidden; }
body[data-route="navigator"] { width:100%; height:100vh; min-height:0; max-height:100vh; overflow:hidden; display:grid; grid-template-rows:auto minmax(0,1fr) auto; background:var(--bg); }
body[data-route="navigator"] > .wrap { grid-row:2; width:100%; max-width:none; min-width:0; min-height:0; margin:0; padding:0; display:flex; flex-direction:column; overflow:hidden; }
body[data-route="navigator"] .context-bar { flex:0 0 auto; min-width:0; overflow:hidden; }
body[data-route="navigator"] main.content-field[data-kap-grid-scroll="true"] { flex:1 1 auto; width:100%; max-width:none; min-width:0; min-height:0; height:auto; margin:0; padding:18px clamp(14px,2.2vw,34px) 42px; display:grid; grid-template-columns:repeat(24,minmax(0,1fr)); grid-auto-rows:max-content; align-content:start; gap:12px; overflow-x:hidden; overflow-y:auto; scrollbar-width:none; }
body[data-route="navigator"] main.content-field[data-kap-grid-scroll="true"]::-webkit-scrollbar { width:0; height:0; }
body[data-route="navigator"] > footer.site { grid-row:3; width:100%; min-height:0; max-height:0; padding:0; overflow:hidden; }
body[data-route="navigator"] .navigator-page { grid-column:1 / -1; width:100%; min-width:0; display:grid; grid-template-columns:repeat(24,minmax(0,1fr)); grid-auto-rows:max-content; gap:12px; align-content:start; }
body[data-route="navigator"] .navigator-page > .navigator-head,
body[data-route="navigator"] .navigator-page > .navigator-controls,
body[data-route="navigator"] .navigator-page > .navigator-workspace { grid-column:1 / -1; min-width:0; }
body[data-route="navigator"] .navigator-head { padding:clamp(18px,2.5vw,34px); border:1px solid color-mix(in srgb,var(--rgbm-system,#35e0e0) 26%,var(--line)); background:linear-gradient(135deg,color-mix(in srgb,var(--rgbm-system,#35e0e0) 10%,transparent),rgba(10,18,34,.94)); }
body[data-route="navigator"] .navigator-head h1 { margin:5px 0 8px; font-family:var(--f-font-sans,var(--sans)); font-size:var(--f-size-page-title,clamp(28px,3.6vw,54px)); line-height:var(--f-line-heading,1.05); }
body[data-route="navigator"] .navigator-head p:last-child { max-width:78ch; margin:0; color:var(--muted); font-family:var(--f-font-sans,var(--sans)); font-size:var(--f-size-body,15px); line-height:var(--f-line-relaxed,1.55); }
body[data-route="navigator"] .navigator-controls { grid-template-columns:minmax(0,1fr) minmax(220px,5fr) minmax(180px,3fr); gap:12px; margin:0; padding:14px; border:1px solid color-mix(in srgb,var(--rgbm-insight,#d66bff) 22%,var(--line)); background:rgba(10,18,34,.9); }
body[data-route="navigator"] .navigator-controls label { min-width:0; color:var(--text); font-family:var(--f-font-sans,var(--sans)); font-size:var(--f-size-03,12px); line-height:var(--f-line-tight,1.2); letter-spacing:var(--f-track-label,.06em); text-transform:uppercase; }
body[data-route="navigator"] .navigator-controls input,
body[data-route="navigator"] .navigator-controls select { min-width:0; min-height:42px; border:1px solid var(--line); border-radius:4px; background:rgba(5,10,20,.84); color:var(--text); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-04,14px); }
body[data-route="navigator"] .navigator-controls p { grid-column:auto; align-self:end; margin:0; color:var(--rgbm-system,#35e0e0); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-03,12px); }
body[data-route="navigator"] .navigator-workspace { display:grid; grid-template-columns:repeat(24,minmax(0,1fr)); gap:12px; margin:0; align-items:start; }
body[data-route="navigator"] .navigator-workspace > .navigator-registry { grid-column:1 / 17; }
body[data-route="navigator"] .navigator-workspace > .navigator-detail { grid-column:17 / 25; position:sticky; top:0; }
body[data-route="navigator"] .navigator-workspace > .panel { min-width:0; margin:0; padding:14px; border:1px solid var(--line); border-radius:4px; background:rgba(10,18,34,.9); }
body[data-route="navigator"] .navigator-section-head { display:flex; min-width:0; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--line); }
body[data-route="navigator"] .navigator-section-head > div { display:flex; min-width:0; align-items:center; gap:8px; }
body[data-route="navigator"] .navigator-section-head h2 { min-width:0; margin:0; font-family:var(--f-font-sans,var(--sans)); font-size:var(--f-size-06,20px); line-height:var(--f-line-heading,1.2); }
body[data-route="navigator"] .navigator-section-head code { max-width:48%; color:var(--rgbm-navigation,#4da3ff); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-02,10px); overflow-wrap:anywhere; text-align:end; }
body[data-route="navigator"] .navigator-step { flex:0 0 auto; color:var(--rgbm-system,#35e0e0); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-03,12px); }
body[data-route="navigator"] .navigator-records { max-height:none; margin:0; gap:6px; }
body[data-route="navigator"] .navigator-records li { min-width:0; }
body[data-route="navigator"] .navigator-records button { min-width:0; padding:10px 12px; border:1px solid color-mix(in srgb,var(--rgbm-navigation,#4da3ff) 18%,var(--line)); border-radius:3px; background:rgba(8,14,28,.72); color:var(--text); }
body[data-route="navigator"] .navigator-records button:hover,
body[data-route="navigator"] .navigator-records button[aria-pressed="true"] { border-color:var(--rgbm-navigation,#4da3ff); background:color-mix(in srgb,var(--rgbm-navigation,#4da3ff) 12%,transparent); }
body[data-route="navigator"] .navigator-records button code { color:var(--rgbm-navigation,#4da3ff); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-02,10px); }
body[data-route="navigator"] .navigator-records button strong { min-width:0; color:var(--text); font-family:var(--f-font-sans,var(--sans)); font-size:var(--f-size-04,14px); line-height:var(--f-line-tight,1.2); overflow-wrap:anywhere; }
body[data-route="navigator"] .navigator-records button span { color:var(--muted); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-02,10px); }
body[data-route="navigator"] .navigator-detail dl { grid-template-columns:minmax(96px,.8fr) minmax(0,1.2fr); margin:0; }
body[data-route="navigator"] .navigator-detail dt { color:var(--rgbm-insight,#d66bff); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-02,10px); text-transform:uppercase; }
body[data-route="navigator"] .navigator-detail dd { color:var(--text); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-03,12px); }
body[data-route="navigator"] .navigator-open { margin-top:16px; border-color:var(--rgbm-action,#2edc8a); color:var(--rgbm-action,#2edc8a); font-family:var(--f-font-mono,var(--mono)); font-size:var(--f-size-03,12px); }
body[data-route="navigator"] .navigator-detail > p { color:var(--muted); font-family:var(--f-font-sans,var(--sans)); line-height:var(--f-line-relaxed,1.55); }

@media (max-width:900px) {
  body[data-route="navigator"] .navigator-controls { grid-template-columns:minmax(0,1fr) minmax(170px,.7fr); }
  body[data-route="navigator"] .navigator-controls p { grid-column:1 / -1; }
  body[data-route="navigator"] .navigator-workspace > .navigator-registry,
  body[data-route="navigator"] .navigator-workspace > .navigator-detail { grid-column:1 / -1; position:static; }
}
@media (max-width:640px) {
  body[data-route="navigator"] main.content-field[data-kap-grid-scroll="true"] { grid-template-columns:repeat(4,minmax(0,1fr)); padding-inline:10px; }
  body[data-route="navigator"] .navigator-page { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
  body[data-route="navigator"] .navigator-controls { grid-template-columns:1fr; gap:8px; }
  body[data-route="navigator"] .navigator-controls p { grid-column:1 / -1; }
  body[data-route="navigator"] .navigator-detail dl { grid-template-columns:1fr; gap:6px; }
  body[data-route="navigator"] .navigator-detail dd { margin-bottom:6px; }
}

/* The shared responsive shell intentionally restores flowing-page behavior
 * with !important. Navigator is the explicit element-owned KAP-GRID exception,
 * so this route-scoped contract must win that shared fallback. */
html:has(body[data-page="navigator"][data-route="navigator"]) { height:100% !important; overflow:hidden !important; }
body[data-page="navigator"][data-route="navigator"] {
  height:100vh !important; min-height:0 !important; max-height:100vh !important;
  overflow:hidden !important; display:grid !important; grid-template-rows:auto minmax(0,1fr) auto !important;
}
body[data-page="navigator"][data-route="navigator"] > header.site[data-global-header] { position:static !important; grid-row:1 !important; height:auto !important; min-height:0 !important; overflow:visible !important; }
body[data-page="navigator"][data-route="navigator"] > .wrap {
  grid-row:2 !important; width:100% !important; max-width:none !important; min-height:0 !important;
  height:auto !important; margin:0 !important; padding:0 !important; display:flex !important;
  flex-direction:column !important; overflow:hidden !important;
}
body[data-page="navigator"][data-route="navigator"] main.content-field[data-kap-grid-scroll="true"] {
  width:100% !important; max-width:none !important; height:auto !important; min-height:0 !important;
  margin:0 !important; padding:18px clamp(14px,2.2vw,34px) 42px !important;
  display:grid !important; grid-template-columns:repeat(24,minmax(0,1fr)) !important;
  grid-template-rows:none !important; grid-auto-rows:max-content !important; grid-auto-flow:row !important;
  align-content:start !important; gap:12px !important; overflow-x:hidden !important; overflow-y:auto !important;
  scrollbar-width:none !important;
}
body[data-page="navigator"][data-route="navigator"] main.content-field[data-kap-grid-scroll="true"]::-webkit-scrollbar { width:0 !important; height:0 !important; }
body[data-page="navigator"][data-route="navigator"] > footer.site { grid-row:3 !important; width:100% !important; min-height:0 !important; max-height:0 !important; padding:0 !important; overflow:hidden !important; }
/* Navigator owns a dense 24-column workspace. At the compact-wide range the
 * gateway label must not compete with the brand cell or primary navigation. */
@media (min-width:1200px) and (max-width:1599px) {
  body[data-page="navigator"] > header.site[data-global-header] .topbar-system { display:none !important; }
  body[data-page="navigator"] > header.site[data-global-header] .topbar-left { overflow:hidden; }
  body[data-page="navigator"] > header.site[data-global-header] .brand-name { overflow:hidden; text-overflow:ellipsis; }
}
@media (max-width:640px) {
  body[data-page="navigator"][data-route="navigator"] main.content-field[data-kap-grid-scroll="true"] {
    grid-template-columns:repeat(4,minmax(0,1fr)) !important; padding-inline:10px !important;
  }
}
