/* Nexscient dashboard styles, built from design v2b tokens.css and the brand guide. ASCII only. */
   Built from deliverables/brand-guide/brand-tokens.css (s174). Every brand value below is copied
   from that file; app layout values are on a 4px grid. Fonts are the site's own files in assets/. */

@font-face {
  font-family: "Inter Tight";
  src: url("/_app/assets/intertight-ngswv5hmafg6iuglbnmjxlsh8ag.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* brand colour (brand-tokens.css, verbatim) */
  --nx-blue:        #010ED0;
  --nx-navy:        #0A0D31;
  --nx-lavender:    #DEE0FF;
  --nx-grey-fill:   #F5F5F5;
  --nx-charcoal:    #242627;
  --nx-muted:       #5F6567;
  --nx-hairline:    #D9D9D9;
  --nx-row-rule:    #D0D0D0;
  --nx-white:       #FFFFFF;

  /* app roles (brand-tokens.css, verbatim) */
  --nx-ground:          var(--nx-grey-fill);
  --nx-surface:         var(--nx-white);
  --nx-surface-selected: var(--nx-lavender);
  --nx-border:          var(--nx-hairline);
  --nx-border-control:  #8A8F91;
  --nx-text-heading:    var(--nx-navy);
  --nx-text:            var(--nx-charcoal);
  --nx-text-muted:      var(--nx-muted);
  --nx-text-disabled:   #9AA0A3;
  --nx-accent:          var(--nx-blue);
  --nx-accent-contrast: var(--nx-white);
  --nx-accent-hover:    #000A9E;
  --nx-focus-ring:      var(--nx-blue);
  --nx-success: #146C3A;  --nx-success-soft: #E8F3EC;
  --nx-warning: #8A4B00;  --nx-warning-soft: #FDF1E2;
  --nx-danger:  #B42318;  --nx-danger-soft:  #FDECEA;

  /* type (brand-tokens.css, verbatim) */
  --nx-font-heading: "Inter Tight", sans-serif;
  --nx-font-ui:      "Inter Tight", sans-serif;
  --nx-font-body:    "Helvetica";
  --nx-font-field:   Helvetica, sans-serif;
  --nx-text-xs:   12px;
  --nx-text-sm:   14px;
  --nx-text-base: 16px;
  --nx-text-lg:   20px;
  --nx-text-xl:   24px;
  --nx-text-2xl:  30px;

  /* shape and space (brand-tokens.css, verbatim) */
  --nx-radius: 4px;
  --nx-radius-panel: 0px;
  --nx-space-1: 4px;  --nx-space-2: 8px;  --nx-space-3: 12px; --nx-space-4: 16px;
  --nx-space-5: 24px; --nx-space-6: 32px; --nx-space-7: 48px; --nx-space-8: 64px;
  --nx-control-height: 44px;
  /* Account-row actions share one width so Change password and Sign out match. */
  --nx-row-action-width: 176px;

  /* app layout (derived, 4px grid) */
  --sidebar-w: 272px;
  --rail-w: 88px;
  --header-h: 72px;   /* site header 70px, snapped to the 4px grid */
  --nav-h: 40px;
  --gutter: 40px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--nx-font-body);
  font-size: var(--nx-text-base);
  line-height: 22.4px;
  font-weight: 400;
  color: var(--nx-text);
  background: var(--nx-surface);
}
h1, h2, h3, h4 { font-family: var(--nx-font-heading); color: var(--nx-text-heading); font-weight: 600; margin: 0; }
p { margin: 0; }
a { color: var(--nx-accent); }
svg.i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
:focus-visible { outline: 2px solid var(--nx-focus-ring); outline-offset: 2px; }
.skip { position: absolute; left: 8px; top: -64px; background: var(--nx-surface); padding: 8px 12px; z-index: 50; border: 1px solid var(--nx-border-control); border-radius: var(--nx-radius); font: 600 var(--nx-text-sm)/20px var(--nx-font-ui); }
.skip:focus { top: 8px; }

/* ---------- App shell ---------- */
.app { display: grid; grid-template-columns: var(--sidebar-w) minmax(0, 1fr); min-height: 100vh;
  background: linear-gradient(to right, var(--nx-ground) calc(var(--sidebar-w) - 1px), var(--nx-border) calc(var(--sidebar-w) - 1px) var(--sidebar-w), var(--nx-surface) var(--sidebar-w)); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--nx-ground); border-right: 1px solid var(--nx-border); }
.brand { height: var(--header-h); display: flex; align-items: center; gap: 8px; padding: 0 20px; border-bottom: 1px solid var(--nx-border); flex: none; }
.brand-link { display: inline-flex; align-items: center; min-height: 44px; border-radius: var(--nx-radius); }
.logo { display: block; height: 32px; width: auto; }
.logo-icon { display: none; height: 32px; width: auto; }
.drawer-title { display: none; }
.nav-close { display: none; }
.nav { flex: 1; overflow-y: auto; padding: 16px 12px; }
.nav ul, .nav-foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.nav-group + .nav-group { margin-top: 16px; }
.nav-label { display: block; font: 600 var(--nx-text-xs)/16px var(--nx-font-ui); color: var(--nx-text-muted); padding: 4px 12px 8px; }
.nav-item {
  position: relative; display: flex; align-items: center; gap: 12px;
  min-height: var(--nav-h); padding: 8px 12px;
  border-radius: var(--nx-radius); text-decoration: none;
  font: 500 var(--nx-text-base)/20px var(--nx-font-ui); color: var(--nx-charcoal);
  border-left: 2px solid transparent;
}
.nav-item svg.i { color: var(--nx-charcoal); }
a.nav-item:hover { background: var(--nx-white); }
.nav-item[aria-current="page"] { background: var(--nx-lavender); color: var(--nx-blue); font-weight: 600; border-left-color: var(--nx-blue); }
.nav-item[aria-current="page"] svg.i { color: var(--nx-blue); }
.lbl-short { display: none; }
.is-soon { cursor: not-allowed; }
.nav-item.is-soon { color: var(--nx-text-disabled); font-weight: 500; }
.nav-item.is-soon svg.i { color: var(--nx-text-disabled); }
.soon {
  margin-left: auto; flex: none;
  font: 600 var(--nx-text-xs)/16px var(--nx-font-ui); color: var(--nx-text-muted);
  background: var(--nx-white); border: 1px solid var(--nx-border); border-radius: var(--nx-radius);
  padding: 0 8px;
}
.nav-foot { border-top: 1px solid var(--nx-border); padding: 12px; flex: none; }
.account { display: flex; align-items: center; gap: 12px; min-height: 48px; margin-top: 8px; padding: 4px 12px; border-radius: var(--nx-radius); text-decoration: none; color: var(--nx-text); }
a.account:hover { background: var(--nx-white); }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--nx-white); border: 1px solid var(--nx-border); color: var(--nx-text-muted); display: inline-grid; place-items: center; flex: none; }
.avatar svg.i { width: 16px; height: 16px; }
.account-name { font: 600 var(--nx-text-sm)/20px var(--nx-font-ui); color: var(--nx-text-heading); display: block; }
.account-meta { font-size: var(--nx-text-xs); line-height: 16px; color: var(--nx-text-muted); display: block; }

.main { min-width: 0; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 5; height: var(--header-h); display: flex; align-items: center; gap: 12px; padding: 0 var(--gutter); background: var(--nx-surface); border-bottom: 1px solid var(--nx-border); }
.menu-btn, .topbar .topbar-logo { display: none; }
.crumbs { display: flex; align-items: center; gap: 8px; font: 500 var(--nx-text-base)/20px var(--nx-font-ui); color: var(--nx-text-muted); min-width: 0; }
.crumbs a { color: var(--nx-text-muted); text-decoration: none; display: inline-flex; align-items: center; border-radius: var(--nx-radius); }
.crumbs a:hover { color: var(--nx-accent); }
.crumbs [aria-current="page"] { color: var(--nx-text-heading); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crumbs svg.i { width: 16px; height: 16px; color: var(--nx-border-control); }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.content { padding: 32px var(--gutter) 64px; }

/* ---------- Page header ---------- */
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.page-head h1 { font-size: var(--nx-text-2xl); line-height: 32px; }
.page-sub { color: var(--nx-text-muted); margin-top: 8px; max-width: 720px; }

/* ---------- Buttons (brand .nx-btn) ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: var(--nx-control-height); padding: 12px 24px;
  font: 600 var(--nx-text-sm)/20px var(--nx-font-ui);
  border-radius: var(--nx-radius); border: 1px solid transparent; box-shadow: none;
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.btn-primary { background: var(--nx-accent); color: var(--nx-accent-contrast); }
.btn-primary:hover { background: var(--nx-accent-hover); }
.btn-secondary { background: var(--nx-lavender); color: var(--nx-blue); }
.btn-outline { background: var(--nx-white); color: var(--nx-blue); border-color: var(--nx-blue); }
.btn-outline:hover { background: var(--nx-lavender); }
.btn-text { background: transparent; color: var(--nx-accent); padding: 12px 8px; }
.btn-danger-text { background: transparent; color: var(--nx-danger); padding: 12px 8px; }
.btn svg.i { width: 16px; height: 16px; }

/* ---------- Chips (brand .nx-chip shape and colour; sentence-case words kept from v2) ---------- */
.chip { display: inline-flex; align-items: center; height: 24px; padding: 0 12px; border-radius: var(--nx-radius); font: 600 var(--nx-text-xs)/16px var(--nx-font-ui); white-space: nowrap; color: var(--nx-muted); background: var(--nx-grey-fill); }
.chip-success { color: var(--nx-success); background: var(--nx-success-soft); }
.chip-danger { color: var(--nx-danger); background: var(--nx-danger-soft); }
.chip-warning { color: var(--nx-warning); background: var(--nx-warning-soft); }
.chip-accent { color: var(--nx-blue); background: var(--nx-lavender); }
.chip-neutral { color: var(--nx-muted); background: var(--nx-white); box-shadow: inset 0 0 0 1px var(--nx-border); }

/* ---------- Status strip ---------- */
.strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.tile { border-top: 1px solid var(--nx-border); padding-top: 16px; min-width: 0; }
.tile-label { font: 500 var(--nx-text-base)/20px var(--nx-font-ui); color: var(--nx-text); }
.tile-value { font: 600 var(--nx-text-xl)/32px var(--nx-font-heading); color: var(--nx-text-heading); margin-top: 8px; }
.tile-ctx { font-size: var(--nx-text-xs); line-height: 16px; color: var(--nx-text-muted); margin-top: 4px; }
.tile.is-soon { cursor: default; }
.tile.is-soon .tile-label { color: var(--nx-text-disabled); }
.tile.is-soon .tile-value { line-height: 32px; }
.tile .soon { margin-left: 0; }

/* ---------- Sections ---------- */
.cols { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 32px; margin-top: 48px; align-items: start; }
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.section-head h2 { font-size: var(--nx-text-lg); line-height: 28px; }
.meta { font-size: var(--nx-text-xs); line-height: 16px; color: var(--nx-text-muted); }

/* list panel (brand .nx-list / .nx-row) */
.list { background: var(--nx-grey-fill); border-radius: var(--nx-radius-panel); border-top: 1px solid var(--nx-row-rule); }
.list-sub { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 24px; background: var(--nx-white); border-bottom: 1px solid var(--nx-row-rule); font: 600 var(--nx-text-xs)/16px var(--nx-font-ui); color: var(--nx-text); }
.row { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 16px; min-height: 64px; padding: 12px 24px; border-bottom: 1px solid var(--nx-row-rule); }
.row-icon { display: inline-grid; place-items: center; color: var(--nx-text-muted); }
.row-icon.warn { color: var(--nx-danger); }
.row-icon.info { color: var(--nx-accent); }
.row-title { font: 600 var(--nx-text-base)/20px var(--nx-font-ui); color: var(--nx-text-heading); display: block; }
.row-meta { font: 400 var(--nx-text-sm)/19.6px var(--nx-font-body); color: var(--nx-text-muted); display: block; margin-top: 4px; }
.row-end { display: flex; align-items: center; gap: 12px; justify-content: flex-end; }
.row.is-soon .row-title { color: var(--nx-text-disabled); font-weight: 500; }
.row.is-soon .row-icon { color: var(--nx-text-disabled); }

.feed { list-style: none; margin: 0; padding: 0; }
.feed li { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; padding: 12px 0; border-top: 1px solid var(--nx-border); align-items: center; }
.feed li:first-child { border-top: 0; padding-top: 4px; }
.feed-text { color: var(--nx-text); }
.feed-text b { font-weight: 600; color: var(--nx-text-heading); font-family: var(--nx-font-ui); }
.feed-time { font-size: var(--nx-text-xs); line-height: 16px; color: var(--nx-text-muted); white-space: nowrap; }

/* ---------- Preview panels (future modules) ---------- */
.previews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.preview { border: 1px dashed var(--nx-border-control); border-radius: var(--nx-radius-panel); background: var(--nx-white); padding: 24px; min-width: 0; }
.preview-head { display: flex; align-items: center; gap: 8px; }
.preview-head svg.i { color: var(--nx-text-disabled); }
.preview-title { font: 600 var(--nx-text-base)/20px var(--nx-font-ui); color: var(--nx-text-muted); }
.preview-copy { color: var(--nx-text-muted); margin-top: 8px; min-height: 44px; }
.preview-tag { font: 600 10px/16px var(--nx-font-ui); letter-spacing: 1px; text-transform: uppercase; color: var(--nx-muted); background: var(--nx-grey-fill); padding: 4px 8px; border-radius: var(--nx-radius); margin-top: 16px; display: inline-block; }
.sk-rows { margin-top: 16px; display: grid; gap: 12px; }
.sk-row { display: grid; grid-template-columns: 1fr 48px; gap: 12px; align-items: center; }
.sk-row.day { grid-template-columns: 40px 1fr; }
.sk-row.num { grid-template-columns: 16px 1fr 32px; }
.sk { height: 8px; border-radius: var(--nx-radius); background: var(--nx-grey-fill); }
.sk.tall { height: 12px; }
.sk.gap { margin-top: 8px; }
.sk.w60 { width: 60%; } .sk.w80 { width: 80%; } .sk.w40 { width: 40%; }
.sk-pill { height: 16px; border-radius: var(--nx-radius); background: var(--nx-grey-fill); }

/* ---------- Settings ---------- */
.settings { display: grid; grid-template-columns: 224px minmax(0, 1fr); gap: 40px; margin-top: 32px; align-items: start; }
.subnav { position: sticky; top: calc(var(--header-h) + 32px); }
.subnav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.settings-body { max-width: 920px; min-width: 0; }
.settings-section + .settings-section { margin-top: 48px; padding-top: 40px; border-top: 1px solid var(--nx-border); }
.settings-section h2 { font-size: var(--nx-text-xl); line-height: 32px; }
.settings-section > p { color: var(--nx-text-muted); margin-top: 8px; max-width: 680px; }
.note { display: flex; gap: 12px; align-items: flex-start; margin-top: 16px; padding: 12px 16px; background: var(--nx-grey-fill); border-left: 2px solid var(--nx-blue); color: var(--nx-text); }
.note svg.i { color: var(--nx-accent); margin-top: 2px; }
.summary { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 32px; margin-bottom: 12px; flex-wrap: wrap; }
.summary h3 { font-size: var(--nx-text-lg); line-height: 28px; }
/* account rows: c3 three-column row inside the brand list panel */
.acct { display: grid; grid-template-columns: 44px minmax(0, 1fr) 128px; column-gap: 16px; row-gap: 12px; align-items: start; padding: 16px 24px; border-bottom: 1px solid var(--nx-row-rule); }
.acct-mono { width: 44px; height: 44px; border-radius: var(--nx-radius); background: var(--nx-white); border: 1px solid var(--nx-border); display: grid; place-items: center; font: 600 var(--nx-text-base)/1 var(--nx-font-ui); color: var(--nx-text-heading); }
.acct-text h4 { font: 600 var(--nx-text-base)/20px var(--nx-font-ui); color: var(--nx-text-heading); padding-top: 4px; }
.acct-line { margin-top: 4px; color: var(--nx-text); font-size: var(--nx-text-sm); line-height: 19.6px; }
.acct-meta { margin-top: 4px; }
.acct-status { padding-top: 4px; }
.acct-status { justify-self: end; }
.acct-actions { grid-column: 2 / -1; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-start; }
.acct-form { grid-column: 2 / -1; display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
.field { display: grid; gap: 4px; }
.field label { font: 500 var(--nx-text-sm)/20px var(--nx-font-ui); color: var(--nx-text); }
.input-wrap { display: flex; align-items: stretch; width: 400px; max-width: 100%; }
.input, .select {
  min-height: var(--nx-control-height); padding: 12px 16px; font: 400 var(--nx-text-sm)/19.6px var(--nx-font-field);
  color: var(--nx-text); background: var(--nx-white); border: 1px solid var(--nx-border-control); border-radius: var(--nx-radius); min-width: 0;
}
.input-wrap .input { flex: 1; border-radius: var(--nx-radius) 0 0 var(--nx-radius); }
.input-wrap .btn { border-radius: 0 var(--nx-radius) var(--nx-radius) 0; border-color: var(--nx-border-control); border-left: 0; padding: 12px 16px; }
.input::placeholder { color: var(--nx-text-muted); }
.select:disabled { background: var(--nx-grey-fill); color: var(--nx-text-disabled); border-color: var(--nx-hairline); cursor: not-allowed; }
.roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.roles .select { width: 100%; }
.blocked { display: flex; align-items: center; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.dl { margin: 16px 0 0; background: var(--nx-grey-fill); border-top: 1px solid var(--nx-row-rule); }
.dl-row { display: grid; grid-template-columns: 160px minmax(0, 1fr) auto; gap: 16px; align-items: center; min-height: 64px; padding: 8px 24px; border-bottom: 1px solid var(--nx-row-rule); }
.dl-row dt { font: 500 var(--nx-text-sm)/20px var(--nx-font-ui); color: var(--nx-text-muted); }
.dl-row dd { margin: 0; color: var(--nx-text-heading); }
.dl-row .btn { min-width: var(--nx-row-action-width); }

.scrim { display: none; }

/* ---------- Under 1200: stack Home columns, Settings sub-nav becomes tabs ---------- */
@media (max-width: 1199px) {
  .cols { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .previews { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
  .settings { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .subnav { position: static; border-bottom: 1px solid var(--nx-border); }
  .subnav ul { display: flex; flex-wrap: wrap; gap: 4px; padding-bottom: 12px; }
  .subnav .nav-item { white-space: nowrap; }
  .settings-body { max-width: none; }
}
@media (min-width: 600px) and (max-width: 1199px) {
  .strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 16px; }
}

/* ---------- Tablet rail: 600 to 999px (no 768px default) ---------- */
@media (min-width: 600px) and (max-width: 999px) {
  .app { --sidebar-w: var(--rail-w); }
  :root { --gutter: 24px; }
  .brand { justify-content: center; padding: 0; }
  .logo { display: none; }
  .logo-icon { display: block; }
  .nav { padding: 8px; }
  .nav-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .nav-group + .nav-group { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--nx-border); }
  .sidebar .nav-item { flex-direction: column; justify-content: center; gap: 4px; min-height: 64px; padding: 8px 4px; font-size: var(--nx-text-xs); line-height: 16px; text-align: center; border-left-width: 2px; }
  .sidebar .lbl { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .sidebar .lbl-short { display: block; }
  /* F-RESP-1: the Soon word sits under the short label, never on the icon box */
  .sidebar .soon { margin: 0; border: 0; background: transparent; padding: 0; font-size: var(--nx-text-xs); line-height: 16px; font-weight: 500; color: var(--nx-text-muted); }
  .nav-foot { padding: 8px; }
  .account { justify-content: center; padding: 4px; }
  .account-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 16px; }
}

/* ---------- Phone: under 600px, top bar plus drawer (dialog) ---------- */
@media (max-width: 599px) {
  :root { --gutter: 20px; --header-h: 64px; }
  .app { grid-template-columns: minmax(0, 1fr); background: var(--nx-surface); }
  .sidebar { position: fixed; z-index: 30; left: 0; top: 0; bottom: 0; height: auto; width: min(320px, 88vw); transform: translateX(-100%); visibility: hidden; border-right: 1px solid var(--nx-border); }
  body.nav-open .sidebar { transform: none; visibility: visible; }
  body.nav-open .scrim { display: block; position: fixed; inset: 0; z-index: 20; background: rgba(10, 13, 49, 0.32); }
  .brand { padding: 0 8px 0 20px; }
  .logo { height: 28px; }
  .nav-close { display: inline-grid; place-items: center; margin-left: auto; width: 44px; height: 44px; border: 0; background: transparent; color: var(--nx-text); border-radius: var(--nx-radius); cursor: pointer; }
  .drawer-title { display: block; font: 600 var(--nx-text-lg)/28px var(--nx-font-heading); color: var(--nx-text-heading); padding: 8px 12px 0; }
  .nav { padding-top: 8px; }
  .nav-item { min-height: 44px; }
  .topbar { padding: 0 20px 0 4px; gap: 8px; }
  .menu-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; color: var(--nx-text-heading); border-radius: var(--nx-radius); cursor: pointer; }
  .menu-btn svg.i { width: 24px; height: 24px; }
  .topbar .topbar-logo { display: block; height: 28px; width: auto; }
  .crumbs { margin-left: auto; }
  .crumbs .crumb-parent, .crumbs .crumb-sep { display: none; }
  .topbar-right { display: none; }
  .content { padding: 24px var(--gutter) 64px; }
  .page-head { align-items: stretch; flex-direction: column; }
  .strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .tile-value { font-size: var(--nx-text-lg); line-height: 28px; }
  .row { grid-template-columns: 20px minmax(0, 1fr); align-items: start; padding: 12px 16px; }
  .row-icon { margin-top: 2px; }
  .row-end { grid-column: 2; justify-content: flex-start; flex-wrap: wrap; }
  .list-sub { padding: 8px 16px; }
  .previews { grid-template-columns: minmax(0, 1fr); }
  .acct { grid-template-columns: 44px minmax(0, 1fr); padding: 16px; }
  .acct-status { grid-column: 2; padding-top: 0; }
  .acct-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .acct-form { grid-column: 1 / -1; }
  .acct-form .btn-primary, .acct-form > .btn { width: 100%; }
  .input-wrap { width: 100%; }
  .roles { grid-template-columns: minmax(0, 1fr); }
  .dl-row { grid-template-columns: minmax(0, 1fr) auto; padding: 8px 16px; }
  .dl-row dt { grid-column: 1 / -1; }
}

/* ---------- Touch targets: 44px under a coarse pointer (F-TOUCH-1 adds the breadcrumb parent) ---------- */
@media (pointer: coarse), (max-width: 599px) {
  .btn, .input, .select, .nav-item, .crumbs a, .account, .brand-link, .skip { min-height: 44px; }
  .crumbs a { min-width: 44px; }
}

@media (forced-colors: active) {
  .is-soon, .is-soon * { color: GrayText !important; }
  .nav-item[aria-current="page"] { outline: 2px solid Highlight; }
}

/* ---------- Build fixes from the s174 design audit ---------- */
/* F-CHIP-1: the neutral chip edge is the hairline, as the plan says. */
.chip.chip-neutral { box-shadow: inset 0 0 0 1px var(--nx-hairline); }
/* F-BODY-1: sentences are charcoal; grey stays for meta lines. */
.page-sub, .settings-section > p, .signin-card > p { color: var(--nx-text); }
/* F-TOUCH-2: the rail brand link is at least 44 by 44. */
@media (min-width: 600px) and (max-width: 999px) {
  .brand-link { min-width: 44px; min-height: 44px; justify-content: center; }
}
/* F-D2-1: the one "last ran" line on Home. */
.last-ran { margin-top: 8px; font: 500 var(--nx-text-sm)/20px var(--nx-font-ui); color: var(--nx-text-muted); }
/* Inactive key form and plain reason (G1 not landed). */
.input:disabled { background: var(--nx-grey-fill); color: var(--nx-text-disabled); border-color: var(--nx-hairline); cursor: not-allowed; }
.btn:disabled { opacity: 1; color: var(--nx-text-disabled); border-color: var(--nx-hairline); background: var(--nx-grey-fill); cursor: not-allowed; }
.form-error { margin-top: 16px; padding: 12px 16px; border-radius: var(--nx-radius); color: var(--nx-danger); background: var(--nx-danger-soft); font: 500 var(--nx-text-sm)/20px var(--nx-font-ui); }
.form-ok { margin-top: 16px; padding: 12px 16px; border-radius: var(--nx-radius); color: var(--nx-success); background: var(--nx-success-soft); font: 500 var(--nx-text-sm)/20px var(--nx-font-ui); }
.stack { display: grid; gap: 16px; margin-top: 24px; max-width: 400px; }
.stack .input { width: 100%; }
.inline-form { display: inline; margin: 0; }
.feed-empty { color: var(--nx-text-muted); padding: 12px 0; }
/* Sign-in and holding pages: no app shell. */
.signin { min-height: 100vh; display: grid; place-items: center; padding: 24px 20px; background: var(--nx-grey-fill); }
.signin-card { width: 100%; max-width: 440px; background: var(--nx-white); border: 1px solid var(--nx-hairline); padding: 32px; }
.signin-card .logo { display: block; margin-bottom: 32px; }
.signin-card h1 { font-size: var(--nx-text-2xl); line-height: 36px; }
.signin-card > p { margin-top: 8px; }
.signin-card .btn { width: 100%; justify-content: center; }
/* s446 (TODO 00215, stage 110): touch targets. The Records "Open" link was 39px wide (its height was already 44px) and the
   sidebar nav items were 40px high from 1000px up (the tablet rail is 64px and the phone drawer 44px already). Both now
   measure at least 44px. Wording, order, icons and the greyed Soon items keep their look. */
.rec-open a { min-width: 44px; }
@media (min-width: 1000px) { .sidebar .nav-item { min-height: 44px; } }
/* s447 (TODO 00216, stage 111): touch targets. The Settings sub-nav items were 40px high from 1000px up (44px below that, on phones and
   coarse pointers already) and the skip link was 38px high when shown. Both now measure at least 44px; the skip link keeps
   its text centred and its hidden-until-focus behaviour. Wording, order and layout are unchanged. */
.subnav .nav-item { min-height: 44px; }
.skip { min-height: 44px; display: inline-flex; align-items: center; }
/* s448 (TODO 00188, stage 112): Settings Channels, the Full article / Title and link choice (44px targets), and the
   Schedule channels line on a queued or test-run row. */
.ct-seg { display: inline-flex; margin: 0; padding: 0; border: 1px solid var(--nx-border-control); border-radius: var(--nx-radius); background: var(--nx-white); overflow: hidden; max-width: 100%; }
.ct-opt { position: relative; display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 14px; font: 600 var(--nx-text-sm)/20px var(--nx-font-ui); color: var(--nx-blue); cursor: pointer; }
.ct-opt + .ct-opt { border-left: 1px solid var(--nx-border-control); }
.ct-opt input { position: absolute; opacity: 0; inset: 0; margin: 0; width: 100%; height: 100%; cursor: pointer; }
.ct-opt:has(input:checked) { background: var(--nx-blue); color: var(--nx-white); }
.ct-opt:has(input:focus-visible) { outline: 2px solid var(--nx-focus-ring); outline-offset: -2px; }
.ct-fixed { display: flex; align-items: center; min-height: 44px; margin: 0; font: 600 var(--nx-text-sm)/20px var(--nx-font-ui); color: var(--nx-text); }
.ct-save { padding: 16px 24px; }
.sc-channels { grid-column: 2 / -1; margin: 4px 0 0; font-size: var(--nx-text-sm, 14px); line-height: 20px; color: var(--nx-text-muted); }
.sc-channels-link { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
@media (max-width: 599px) { .ct-seg { display: flex; width: 100%; } .ct-opt { flex: 1 1 0; } .ct-save { padding: 16px; } .sc-channels { grid-column: 2; } }
/* s449 (TODO 00189.a, stage 113): Settings Channels, the Connect form (a disclosure per channel, 44px targets). */
.cc { grid-column: 2 / -1; min-width: 0; }
.cc > summary { list-style: none; display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; }
.cc > summary::-webkit-details-marker { display: none; }
.cc-btn { min-height: 44px; }
.cc-body { display: grid; gap: 12px; margin-top: 12px; max-width: 480px; }
.cc-input { width: 100%; min-height: 44px; box-sizing: border-box; }
.cc-opt { font-weight: 400; color: var(--nx-text-muted); }
.cc-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.cc-last4 { font-weight: 400; }
.cc-error { margin: 0; }
.cc-form { display: none; }
@media (max-width: 599px) { .cc { grid-column: 1 / -1; } .cc > summary, .cc-actions .btn { width: 100%; justify-content: center; } .cc-body { max-width: none; } }