/* Full viewport handbook. Navigation lives in the header; categories stay inside the app. */
[data-nightshift] { display: none; }
html.ns-active {
  --ns-ink: #101412; --ns-panel: #151916; --ns-line: #303633;
  --ns-copy: #eceeec; --ns-muted: #aeb4b3; --ns-copper: #d79758;
  --ns-rail: 132px; --ns-header: 82px; --ns-footer: 90px;
  --bg: #101412; --bg-sidebar: #121714; --bg-card: #171c18;
  --bg-hover: #252c25; --bg-active: #30271f; --border: #343b34;
  --accent: #d79758; --text: #eceeec; --text-dim: #adb4b0; --text-muted: #8e9993;
  --topbar-h: 82px; color-scheme: dark;
}

html.ns-active { --ns-header:80px; --ns-footer:64px; --topbar-h:80px; --ns-nav:272px; --ns-aside:332px; }
html.ns-active body { display:block; width:100%; height:100dvh; margin:0; padding:0; overflow:hidden; background:var(--ns-ink); color:var(--ns-copy); }
html.ns-active .main-wrapper { --ns-scene:url('../images/nightshift-desk.webp'); display:grid; grid-template-columns:0px minmax(0,1fr) var(--ns-aside); grid-template-rows:var(--ns-header) minmax(0,1fr) var(--ns-footer); position:relative; isolation:isolate; width:100%; max-width:none; height:100dvh; margin:0; padding:0; overflow:hidden; border:0; background:var(--ns-ink); opacity:1; transform:none !important; animation:none !important; transition:grid-template-columns .26s cubic-bezier(.2,.7,.2,1); }
html.ns-active.ns-nav-open .main-wrapper { grid-template-columns:var(--ns-nav) minmax(0,1fr) var(--ns-aside); }
html.ns-active .main-wrapper::before, html.ns-active .main-wrapper.home-full-bg::before { content:''; display:block !important; position:absolute; inset:var(--ns-header) 0 var(--ns-footer); z-index:-1; background:linear-gradient(#101412a8,#101412d9),var(--ns-scene) center / cover no-repeat; opacity:1 !important; filter:none; pointer-events:none; }
html.ns-active .main-wrapper > .halloween-decor, html.ns-active .main-wrapper > .halloween-pumpkin-button, html.ns-active .content::before { display:none !important; }
html.ns-active .topbar { display:grid; grid-template-columns:auto auto minmax(140px,1fr) auto; grid-column:1 / -1; grid-row:1; align-items:center; gap:28px; position:relative; z-index:50; padding:0 28px; height:var(--ns-header); background:var(--ns-ink); border-bottom:1px solid var(--ns-line); }
html.ns-active .topbar > .breadcrumb, html.ns-active .topbar > .sidebar-toggle, html.ns-active .topbar > .topbar-right { display:none; }
html.ns-active .ns-brand { display:flex; align-items:center; gap:12px; min-width:0; color:var(--ns-copy); font-size:23px; font-weight:750; text-decoration:none; letter-spacing:-.7px; white-space:nowrap; }
html.ns-active .ns-brand > img { display:block; width:44px; height:44px; padding:0; background:none; border:0; border-radius:50%; box-shadow:none; object-fit:contain; flex:none; }
html.ns-active .ns-brand-copy { color:var(--ns-copy); }
html.ns-active .ns-brand strong { color:var(--ns-copper); font:inherit; }
html.ns-active .ns-rail { display:flex; align-items:center; position:static; gap:6px; width:auto; height:auto; border:0; padding:0; background:none; }
html.ns-active .ns-rail-button { display:flex; align-items:center; gap:8px; min-height:40px; width:auto; padding:9px 12px; border:1px solid transparent; border-radius:7px; background:transparent; color:var(--ns-muted); font:inherit; font-size:13px; font-weight:600; white-space:nowrap; cursor:pointer; transition:background .18s,color .18s,border-color .18s; }
html.ns-active .ns-rail-button svg { width:18px; height:18px; flex:none; }
html.ns-active .ns-rail-button > svg:last-child:not(:first-child) { width:13px; height:13px; transition:transform .22s; }
html.ns-active .ns-rail-button[aria-expanded="true"] > svg:last-child { transform:rotate(180deg); }
html.ns-active .ns-rail-button:is(:hover,.is-active) { color:var(--ns-copy); background:color-mix(in srgb,var(--ns-copper) 10%,transparent); border-color:color-mix(in srgb,var(--ns-copper) 30%,transparent); }
html.ns-active .ns-rail-button.is-active svg { color:var(--ns-copper); }
html.ns-active .ns-rail-category { display:flex; align-items:center; gap:3px; min-height:40px; padding-right:4px; border:1px solid var(--ns-line); border-radius:7px; background:transparent; }
html.ns-active .ns-category-label { display:flex; align-items:center; gap:8px; padding:0 8px 0 11px; color:var(--ns-muted); font-size:13px; font-weight:600; cursor:default; }
html.ns-active .ns-category-label svg { width:18px; height:18px; }
html.ns-active .ns-category-toggle { display:grid; place-items:center; width:30px; min-height:30px; height:30px; padding:0; border-color:var(--ns-line); color:var(--ns-copper); }
html.ns-active .ns-category-toggle > svg { width:14px; height:14px; transition:transform .28s cubic-bezier(.22,.75,.22,1); }
html.ns-active .ns-category-toggle[aria-expanded="true"] > svg { transform:rotate(180deg); }
html.ns-active .ns-rail-category:has([aria-expanded="true"]) { background:color-mix(in srgb,var(--ns-copper) 6%,transparent); border-color:color-mix(in srgb,var(--ns-copper) 35%,var(--ns-line)); }
html.ns-active .main-wrapper > .content { position:relative; z-index:1; grid-column:2; grid-row:2; min-height:0; min-width:0; width:100%; max-width:none; height:auto; margin:0; padding:28px 36px 40px; overflow:auto; scrollbar-gutter:stable; background:#10141238; }
html.ns-active #searchWrap { display:flex; position:relative; width:100%; min-width:0; }
html.ns-active #searchIconBtn,html.ns-active .reader-mobile-search-close,html.ns-active #sidebarToggle { display:none !important; }
html.ns-active #searchIconBtn svg { width: 20px; height: 20px; flex: none; }
html.ns-active #searchWrap::before { content: ''; width: 18px; height: 18px; left: 15px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aeb4b3' stroke-width='1.5'%3E%3Ccircle cx='10.5' cy='10.5' r='7'/%3E%3Cpath d='m16 16 5 5'/%3E%3C/svg%3E") center / contain; }
html.ns-active #searchInput { width: 100%; height: 45px; border: 1px solid #333a35; border-radius: 5px; background: #1c201e; color: #eceeec; padding: 10px 88px 10px 45px; font: inherit; font-size: 14px; }
html.ns-active #searchWrap #searchInput { display:block !important; visibility:visible !important; opacity:1; width:100%; padding:10px 88px 10px 45px; border:1px solid var(--ns-line); }
html.ns-active #searchWrap #searchInput:focus { border-color:var(--ns-copper); }
html.ns-active #searchInput::placeholder { color: #9fa8a2; }
html.ns-active #searchInput:focus { border-color: #a97950; background: #1b211c; box-shadow: 0 0 0 2px #d7975812; }
html.ns-active .ns-search-key { display: block; position: absolute; right: 12px; color: #a1aaa4; border: 1px solid #3a423b; border-radius: 3px; padding: 2px 5px; font: inherit; font-size: 10px; pointer-events: none; }
html.ns-active #searchDropdown.reader-search-open { position:absolute; left:0; right:0; top:calc(100% + 9px); width:100%; min-width:0; max-width:none; max-height:min(520px,calc(100dvh - var(--ns-header) - 28px)); padding:8px; border-radius:10px; background:var(--ns-panel); border:1px solid var(--ns-line); box-shadow:0 18px 48px #0006; scrollbar-gutter:stable; overflow:auto; }
html.ns-active .reader-search-heading { position:sticky; top:-8px; z-index:1; margin:0 0 4px; padding:10px 12px 12px; background:var(--ns-panel); color:var(--ns-muted); border-color:var(--ns-line); font-size:11px; }
html.ns-active .reader-search-result { position:relative; margin:0; padding:13px 38px 13px 12px; border:0; border-radius:6px; border-bottom:1px solid var(--ns-line); font-size:13px; line-height:1.5; }
html.ns-active .reader-search-result:last-child { border-bottom:0; }
html.ns-active .reader-search-result::after { content:''; position:absolute; top:18px; right:15px; width:7px; height:7px; border-top:1.5px solid var(--ns-muted); border-right:1.5px solid var(--ns-muted); transform:rotate(45deg); }
html.ns-active .reader-search-result > span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; margin-top:4px; font-size:12px; line-height:1.6; }
html.ns-active .reader-search-result strong { color: #eef0ec; }
html.ns-active .reader-search-result > span { color: #aeb9b0; }
html.ns-active .reader-search-result:is(:hover,.is-selected) { background: #2e3428; }
html.ns-active .reader-search-result mark { background: #795937; color: #fff5e7; }
html.ns-active .ns-profile { display: flex; align-items: center; gap: 20px; position: relative; min-width: 0; }
html.ns-active .ns-profile-toggle { display: flex; align-items: center; gap: 13px; padding: 0; background: none; border: 0; color: #eceeec; cursor: pointer; font: inherit; font-size: 13px; }
html.ns-active .ns-profile-avatar { display: grid; place-items: center; width: 41px; height: 41px; border: 1px solid #555c50; background: #29302a; border-radius: 50%; overflow: hidden; flex: none; color: #e2b88b; font-size: 13px; }
html.ns-active .ns-profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
html.ns-active .ns-profile-avatar [hidden] { display: none; }
html.ns-active .ns-profile-name { max-width: 125px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
html.ns-active .ns-profile-toggle > svg { width: 14px; height: 14px; }
html.ns-active .ns-profile #topbarUser { display: block; }
html.ns-active .ns-profile .topbar-user-chip { border: 0; border-left: 1px solid #596258; border-radius: 0; background: none; overflow: visible; padding-left: 18px; }
html.ns-active .ns-profile .topbar-user-chip::before,
html.ns-active .ns-profile .topbar-id-hash,
html.ns-active .ns-profile .topbar-id-num { display: none; }
html.ns-active .ns-profile .topbar-logout-btn { color: #e0a56d; background: none; border: 0; padding: 6px 0; font-size: 13px; font-weight: 600; }
html.ns-active .ns-profile .topbar-logout-btn:hover { color: #ffd2a2; }
html.ns-active .ns-profile-popover { position: absolute; z-index: 80; right: 0; top: calc(100% + 19px); width: 245px; padding: 12px; border: 1px solid #53604f; border-radius: 6px; background: #171e18; box-shadow: 0 16px 40px #000b; }
html.ns-active .ns-profile-popover[hidden] { display: none; }
html.ns-active .ns-profile-popover p { padding: 4px 8px 10px; color: #aeb7ad; font-size: 12px; border-bottom: 1px solid #384137; margin-bottom: 6px; }
html.ns-active .ns-profile-popover button { display: flex; width: 100%; padding: 10px 8px; margin: 2px 0; border: 0; border-radius: 3px; background: transparent; color: #e0e5dc; font: inherit; font-size: 12px; text-align: left; cursor: pointer; }
html.ns-active .ns-profile-popover button:hover { background: #303829; }
html.ns-active .ns-profile-popover #topbarUser { width:100%; padding-top:6px; margin-top:8px; border-top:1px solid var(--ns-line); }
html.ns-active .ns-profile-popover .topbar-user-chip { display:block !important; width:100%; padding:0; border:0; }
html.ns-active .ns-profile-popover #topbarUser .topbar-logout-btn { width:100%; padding:10px 8px; text-align:left; }
html.ns-active .ns-profile-popover button[hidden],
html.ns-active .ns-profile-popover #topbarTenure[hidden] { display: none; }
html.ns-active .ns-home-view { display: none; }
html.ns-active.ns-home .main-wrapper > .content { padding:0; background:var(--ns-ink); }
html.ns-active.ns-home .ns-home-view { display: block; }
html.ns-active.ns-home .content > .reader-article-tools { display: none; }
/* The homepage article follows the hero and directory; the legacy viewport
   minimum would append an empty screen below its short introduction. */
html.ns-active.ns-home .content > .content-page { min-height:0; padding: 20px 36px 20px 44px; margin: 0; width: 100%; max-width: none; }
html.ns-active.ns-home .content-page > .page-hero-banner { display: none; }
html.ns-active .ns-hero { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); min-height:350px; position:relative; overflow:hidden; background:var(--ns-ink); border-bottom:1px solid var(--ns-line); }
html.ns-active .ns-hero::before { display:none; }
html.ns-active .ns-hero-copy { position:relative; z-index:1; padding:42px 12px 32px 36px; }
html.ns-active .ns-kicker { font-size:9px; letter-spacing:.2em; font-weight:650; color:var(--ns-muted); margin:0 0 16px; }
html.ns-active .ns-hero h1 { font-size:clamp(36px,3vw,52px); line-height:1.12; font-weight:760; color:var(--ns-copy); letter-spacing:-1.8px; margin:0 0 13px; }
html.ns-active .ns-lead { color:var(--ns-copy); font-size:clamp(17px,1.35vw,23px); line-height:1.5; font-weight:400; margin:0; }
html.ns-active .ns-hero-rule { display:block; height:2px; width:52px; margin:22px 0 17px; background:var(--ns-copper); }
html.ns-active .ns-hero-intro { color:var(--ns-muted); font-size:13px; line-height:1.8; max-width:340px; margin:0; }
html.ns-active .ns-hero-media { position:relative; min-width:0; align-self:stretch; margin:0; overflow:hidden; }
html.ns-active .ns-hero-media img { display:block; width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:72% 52%; }
html.ns-active .ns-hero-media::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,var(--ns-ink),transparent 24%),linear-gradient(0deg,#030609b8,transparent 25%); }
html.ns-active .ns-hero-media figcaption { position:absolute; z-index:1; right:24px; bottom:20px; color:#e5e8e9; font-size:10px; letter-spacing:.04em; }
html.ns-active .ns-hero-media figcaption span { padding:0 9px; color:#e0b285; }
html.ns-active .ns-directory { padding:27px 36px 0; }
html.ns-active .ns-directory-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:15px; }
html.ns-active .ns-directory h2 { margin:0; padding:0; color:var(--ns-copy); font-size:19px; line-height:1.4; font-weight:650; border:0; }
html.ns-active .ns-directory-heading > span { display:flex; align-items:center; gap:7px; flex:none; color:var(--ns-muted); font-size:11px; }
html.ns-active .ns-directory-heading > span svg { width:13px; height:13px; }
html.ns-active .ns-directory-list { overflow:hidden; border:1px solid var(--ns-line); border-radius:10px; background:color-mix(in srgb,var(--ns-panel) 92%,transparent); }
html.ns-active .ns-directory-row { display:grid; grid-template-columns:48px minmax(130px,.85fr) minmax(160px,1.55fr) 30px; align-items:center; gap:17px; width:100%; min-height:91px; padding:17px 20px; background:transparent; border:0; border-bottom:1px solid var(--ns-line); color:var(--ns-copy); font:inherit; text-align:left; cursor:pointer; transition:background .18s; }
html.ns-active .ns-directory-row:last-child { border-bottom:0; }
html.ns-active .ns-directory-row:hover { background:color-mix(in srgb,var(--ns-copper) 8%,transparent); }
html.ns-active .ns-directory-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:9px; background:color-mix(in srgb,var(--ns-copper) 9%,transparent); color:var(--ns-copper); }
html.ns-active .ns-directory-icon svg { width:27px; height:27px; }
html.ns-active .ns-directory-label { min-width: 0; }
html.ns-active .ns-directory-label strong { display:block; color:var(--ns-copy); font-size:16px; line-height:1.4; font-weight:650; }
html.ns-active .ns-directory-label small { display:block; color:var(--ns-muted); font-size:12px; margin-top:4px; line-height:1.4; }
html.ns-active .ns-directory-desc { color:var(--ns-muted); font-size:12px; line-height:1.75; }
html.ns-active .ns-chevron { display:grid; place-items:center; width:29px; height:29px; border:1px solid var(--ns-line); border-radius:50%; color:var(--ns-muted); transition:color .18s,border-color .18s,transform .18s; }
html.ns-active .ns-chevron svg { width:15px; height:15px; }
html.ns-active .ns-directory-row:hover .ns-chevron { color:var(--ns-copper); border-color:var(--ns-copper); transform:translateX(2px); }
html.ns-active .ns-sidebar { display: flex; flex-direction: column; gap: 22px; grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; padding: 24px 20px 0 25px; overflow: auto; background: #101412; border-left: 1px solid #303733; scrollbar-gutter: stable; }
html.ns-active .ns-sidebar .reader-favorites,
html.ns-active .ns-sidebar .reader-recent { flex: none; border: 0 !important; border-radius: 0; background: transparent; padding: 0; margin: 0; overflow: visible; box-shadow: none; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) { display: flex; gap: 14px; align-items: center; padding: 4px 2px 12px; min-height: 40px; border: 0; border-bottom: 1px solid #384036; border-radius: 0; background: transparent; color: #eceeec; font-size: 18px; font-weight: 650; letter-spacing: 0; text-transform: none; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading):hover { background: #1b241c; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) > svg { width: 24px; height: 24px; color: #e0a15f; stroke: currentColor; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) b { margin-left: auto; background: transparent; border: 0; color: #939e95; font-size: 10px; }
html.ns-active .ns-sidebar :is(.reader-favorites-list,.reader-recent-list) { padding: 0; max-height: 156px; overflow: auto; list-style: none; }
html.ns-active .ns-sidebar .reader-favorites-list li { gap: 0; border: 0; border-bottom: 1px solid #303831; border-radius: 0; background: transparent; }
html.ns-active .ns-sidebar .reader-favorite-link { display: flex; align-items: center; gap: 15px; min-height: 53px; border-radius: 0; color: #e2e6e0; font-size: 13px; padding: 12px 4px; }
html.ns-active .ns-sidebar .reader-favorite-link::before,
html.ns-active .ns-sidebar .reader-recent-link::before { content: ''; flex: 0 0 21px; position: static; width: 21px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dca264' stroke-width='1.5'%3E%3Cpath d='M6 2h9l4 4v16H6ZM14 2v5h5M9 11h7M9 15h7M9 18h5'/%3E%3C/svg%3E") center / contain no-repeat; transform: none; border-radius: 0; }
html.ns-active .ns-sidebar .reader-favorite-remove { color: #ca9c6a; background: none; font-size: 21px; width: 24px; }
html.ns-active .ns-sidebar .reader-recent-day { display: none; }
html.ns-active .ns-sidebar .reader-recent-list li { margin: 0; padding: 0; border: 0; border-bottom: 1px solid #303831; }
html.ns-active .ns-sidebar .reader-recent-link { display: grid; grid-template-columns: 21px minmax(0,1fr) auto; gap: 14px; width: 100%; min-height: 51px; padding: 13px 4px; border-radius: 0; background: transparent; color: #e2e6e0; font: inherit; font-size: 13px; }
html.ns-active .ns-sidebar .reader-recent-link time { color: #909b93; font-size: 10px; }
html.ns-active .ns-sidebar .reader-recent-link.is-current,
html.ns-active .ns-sidebar .reader-favorite-link.is-current { background: #1d251e; color: #eceeec; }
html.ns-active .ns-sidebar :is(.reader-favorites-empty,.reader-recent-empty,.ns-empty) { color: #a3aea5; font-size: 12px; line-height: 1.7; padding: 15px 3px; margin: 0; }
html.ns-active .ns-changes { flex: none; }
html.ns-active .ns-module-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid #384036; }
html.ns-active .ns-module-head h2 { display: flex; align-items: center; gap: 13px; font-size: 18px; font-weight: 650; margin: 0; white-space: nowrap; }
html.ns-active .ns-module-head h2 svg { width: 23px; height: 23px; color: #dfa466; }
html.ns-active .ns-module-head > button { background: none; border: 0; color: #d5a06b; padding: 3px 0; font: inherit; font-size: 10px; line-height: 1.4; cursor: pointer; }
html.ns-active .ns-change { display: block; position: relative; width: 100%; border: 0; background: none; padding: 12px 0 0 21px; text-align: left; font: inherit; cursor: pointer; }
html.ns-active .ns-change::before { content: ''; position: absolute; top: 16px; left: 2px; width: 7px; height: 7px; border-radius: 50%; background: #d69a62; }
html.ns-active .ns-change time { display: block; color: #96a298; font-size: 11px; margin-bottom: 3px; }
html.ns-active .ns-change strong { display: block; font-size: 12px; font-weight: 600; color: #e0e7df; }
html.ns-active .ns-change p { margin: 4px 0 0; color: #a4b0a7; font-size: 11px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html.ns-active .ns-change:hover strong { color: #edb079; }
html.ns-active .ns-quiz-card { position: relative; min-height: 175px; margin-top: auto; flex: none; border: 1px solid #394135; border-radius: 4px; background: #121710 url('../images/nightshift-quiz.webp') left center / cover no-repeat; }
html.ns-active .ns-quiz-card[hidden] { display: none; }
html.ns-active .ns-quiz-copy { margin-left: 47%; padding: 16px 12px 14px 4px; }
html.ns-active .ns-quiz-copy h2 { display: flex; align-items: center; gap: 8px; color: #e4a267; font-size: 15px; margin: 0 0 12px; font-weight: 600; }
html.ns-active .ns-quiz-copy h2 svg { width: 20px; height: 20px; }
html.ns-active .ns-quiz-copy > strong { font-size: 11px; color: #e0e5da; font-weight: 600; }
html.ns-active .ns-quiz-copy p { font-size: 10px; line-height: 1.4; color: #b2bbac; margin: 3px 0 10px; }
html.ns-active .ns-quiz-copy button { display: flex; justify-content: center; gap: 17px; width: 100%; background: #d19a64; color: #161b13; border: 1px solid #e3b07e; border-radius: 3px; min-height: 31px; padding: 7px 8px; font: inherit; font-size: 11px; font-weight: 650; cursor: pointer; }
html.ns-active .ns-quiz-copy button:hover { background: #e7ad73; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading),
html.ns-active .ns-module-head h2 { font-size: 20px; }
html.ns-active .ns-sidebar .reader-favorite-link,
html.ns-active .ns-sidebar .reader-recent-link { font-size: 14px; }
html.ns-active .ns-change strong { font-size: 13px; }
html.ns-active .ns-change p,
html.ns-active .ns-change time { font-size: 12px; }
html.ns-active .ns-quiz-copy p { font-size: 11px; }
html.ns-active .ns-quiz-copy h2 { font-size: 16px; }
html.ns-active .ns-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; grid-row: 3; grid-column: 1 / -1; border-top: 1px solid #333b32; padding: 18px 20px 18px 40px; background: #111612ed; }
html.ns-active .ns-footer-copy { flex: 1; color: #d3d9ce; font-size: 11px; line-height: 1.6; margin: 0; }
html.ns-active .ns-footer-copy span { color: #6b7768; margin: 0 12px; }
html.ns-active .ns-footer-copy small { font-size: 11px; color: #9da89c; }
html.ns-active .ns-footer-controls { display: flex; align-items: center; gap: 14px; }
html.ns-active .ns-footer-controls > button { display: flex; align-items: center; gap: 9px; white-space: nowrap; padding: 5px 3px; border: 0; border-radius: 0; background: transparent; color: #c5cdc2; cursor: pointer; font: inherit; font-size: 12px; height: auto; width: auto; }
html.ns-active .ns-theme-toggle > [data-halloween-label] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
html.ns-active .ns-footer-controls > button + button:not(.ns-theme-toggle) { border-left: 1px solid #444f40; padding-left: 15px; }
html.ns-active .ns-footer-controls > button > svg { width: 19px; height: 19px; color: #c2c9c2; }
html.ns-active .ns-footer-controls > [data-season-open] > svg { color: #d19355; }
html.ns-active .ns-footer-controls > button:hover { color: #ffd0a2; }
html.ns-active .ns-footer-controls .reader-focus-button::after { top: auto; bottom: calc(100% + 12px); background: #1b231b; border-color: #5d6b55; color: #e0e7dc; }
html.ns-active .ns-footer-controls .reader-focus-button > span { display: inline; }
html.ns-active .ns-footer .season-switch-track { background: #855937; border-color: #d09c6a; width: 40px; height: 21px; }
html.ns-active .ns-footer .season-switch-track::after { width: 15px; height: 15px; top: 2px; left: 2px; transform: translateX(18px); background: #f0e8dc; }
html.ns-active .reader-article-tools { border-color: #394334; }
html.ns-active .reader-settings-button,
html.ns-active .reader-star { border-color: #56634c; background: #20291f; color: #e1d3be; }
html.ns-active .content-page .page-hero-banner { border-radius: 4px; border-color: #46533e; background: #1d251d; padding-block: 24px; }
html.ns-active .content-page .phb-logo { background: #151c15; border-color: #82633f; }
html.ns-active .content-page :is(.page-badge,.reg-kicker) { color: #daa16b; }
html.ns-active .content-page :is(.reg-intro,.km-head,.limity-card,.wyp-card,.sl-unit,.km-tile) { background: #161e17; border-color: #3f5039; }
html.ns-active .content-page .reg-warn { background: #211b17; border-color: #694a3b; }
html.ns-active .content-page .reg-kicker--danger { color: #e1a193; }
html.ns-active .content-page .reg-item { background: #181f18 !important; border-color: #3c4a36 !important; }
html.ns-active .content-page .reg-num { background: #342a1f; border-color: #715537; color: #e2b27b; }
html.ns-active.ns-home .content-page .reg-intro { background: #151c16; border-color: #354530; }
html.ns-active :is(.reader-settings-dialog,.reader-changes-dialog,.reader-preview-dialog,.season-effects-dialog,.pq-dialog) { background: #141c16; border-color: #647052; border-radius: 8px; color: #dbe4d6; }
html.ns-active dialog::backdrop { background: #020703c4; backdrop-filter: blur(5px); }
html.ns-active :is(.reader-settings-head,.reader-settings-footer,.pq-head,.pq-footer,.season-effects-head,.season-effects-footer) { background-color: #111812; border-color: #3d4d35; }
html.ns-active :is(.reader-settings-close,.reader-dialog-close,.season-effects-close,.pq-close) { border-color: #4d5c43; background: #202a1d; color: #d1dcc9; }
html.ns-active .reader-settings-choices label span { background: #1d291c; border-color: #47583d; color: #d4dfcb; }
html.ns-active .reader-settings-body fieldset { background: #1b241d; border-color: #44533c; }
html.ns-active .reader-settings-body fieldset > p { color: #b2beb0; }
html.ns-active .reader-settings-choices input:checked + span { background: #3e3324; border-color: #bd8a58; color: #f5e4ca; }
html.ns-active :is(.reader-settings-done,.reader-settings-reset,.reader-preview-close) { background: #805c3a; border-color: #ba8d5e; color: #fff1db; }
html.ns-active :is(.reader-change-row,.season-effect-option,.pq-rules > span,.pq-option,.pq-answer-review) { background: #1c281d; border-color: #4c5c41; }
html.ns-active .reader-changes-toolbar,
html.ns-active .reader-change-footer { border-color: #42543b; }
html.ns-active .reader-changes-search { background: #101910; border-color: #475b3e; color: #dce6d3; }
html.ns-active :is(.reader-change-date,.reader-change-link,.pq-rules strong,.season-option-caption) { color: #deab79; }
html.ns-active .season-effect-option:has(input:checked) { border-color: #c59661; background: #302b20; }
html.ns-active .pq-option:hover { background: #303d28; border-color: #ae8a58; }
html.ns-active .pq-dialog .pq-option:disabled { cursor: default; }
html.ns-active .pq-option.is-correct { background: #293e2c; border-color: #7c9d6b; }
html.ns-active .pq-option.is-wrong { background: #492c2d; border-color: #a16f6b; }
html.ns-active .pq-message { background: #2a2c1f; }
html.ns-active .pq-stats { background: #1b251c; border-color: #566345; border-radius: 6px; }
html.ns-active .pq-stamps > span { background-color: #172118; border-color: #43553d; color: #b7c4ad; }
html.ns-active .pq-stamps > .is-won { background-color: #29432d; border-color: #82a16c; }
html.ns-active .pq-stamps > .is-lost { background-color: #402b29; border-color: #9d6e60; }
html.ns-active .pq-info > .pq-rule-note { background: #252b1f; color: #c3cdbb; border-color: #b18a55; }
html.ns-active .pq-collection-progress { background: #3d4934; }
html.ns-active .pq-result-question { background: #1a241b; border-color: #46583c; color: #d0dec6; }
html.ns-active .pq-submitting .pq-option.is-selected { background: #3c3827; border-color: #d5a367; }
html.ns-active :is(.pq-rules b,.pq-storage,.pq-stamps-legend,.pq-collection-details > p) { color: #b1bba8; }
html.ns-active .reader-update-date time { color: #c8d0bf; }
html.ns-active :is(.reader-update-date > span,.reader-update-unknown) { color: #a7b29e; }
html.ns-active .reader-focus-button[aria-pressed="true"] { color: #e5b67f; }

/* Frame surfaces and document typography */
html.ns-active .ns-sidebar { grid-column:3; gap:18px; padding:22px; overflow:hidden; background:#101412ed; border-left-color:var(--ns-line); }
html.ns-active .ns-materials { display:flex; flex-direction:column; gap:16px; flex:1; min-height:0; padding:0 3px 2px 0; overflow:auto; scrollbar-width:thin; }
html.ns-active .ns-sidebar :is(.reader-favorites,.reader-recent,.ns-changes) { flex:none; padding:0; margin:0 !important; border:1px solid var(--ns-line) !important; border-radius:10px; background:var(--ns-panel); overflow:hidden; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) { min-height:48px; gap:9px; padding:13px 12px; border-bottom:1px solid var(--ns-line); color:var(--ns-copy); font-size:15px; font-weight:650; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) > svg { width:20px; height:20px; color:var(--ns-copper); }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) b { min-width:22px; padding:2px 5px; border-radius:5px; background:color-mix(in srgb,var(--ns-copper) 10%,transparent); color:var(--ns-muted); font-size:10px; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading)::after { flex:none; border-color:var(--ns-muted); }
html.ns-active .ns-sidebar .is-collapsed :is(.reader-favorites-heading,.reader-recent-heading) { border-bottom-color:transparent; }
html.ns-active .ns-sidebar :is(.reader-favorites-list,.reader-recent-list) { margin:0; padding:4px 7px; max-height:252px; scrollbar-width:thin; }
html.ns-active .ns-sidebar :is(.reader-favorites-list,.reader-recent-list) li:last-child { border-bottom:0; }
html.ns-active .ns-sidebar :is(.reader-favorite-link,.reader-recent-link) { min-height:47px; padding:10px 7px; gap:9px; border-radius:5px; font-size:12px; }
html.ns-active .ns-sidebar :is(.reader-favorite-link,.reader-recent-link)::before { width:17px; height:20px; flex-basis:17px; }
html.ns-active .ns-sidebar .reader-recent-link { grid-template-columns:17px minmax(0,1fr) auto; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading):hover { background:transparent; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) { cursor:default; padding:10px 11px; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading)::after { display:none; }
html.ns-active .ns-sidebar .reader-section-toggle { width:28px; height:28px; border-color:var(--ns-line); color:var(--ns-copper); }
html.ns-active .ns-sidebar .reader-section-toggle svg { stroke:currentColor; }
html.ns-active .ns-sidebar .reader-section-toggle:hover { background:color-mix(in srgb,var(--ns-copper) 13%,transparent); }
html.ns-active .ns-sidebar .reader-recent-list { max-height:220px; padding:8px; scrollbar-gutter:stable; scrollbar-color:color-mix(in srgb,var(--ns-muted) 45%,transparent) transparent; }
html.ns-active .ns-sidebar .reader-recent-list li:not(.reader-recent-day) { height:48px; padding:0; margin:0 0 4px; border:0 !important; }
html.ns-active .ns-sidebar .reader-recent-list li:last-child { margin-bottom:0; }
html.ns-active .ns-sidebar .reader-recent-link { grid-template-columns:17px minmax(0,1fr) 34px; height:48px; min-height:48px; padding:10px 8px; align-items:center; font-weight:500; box-shadow:inset 0 -1px color-mix(in srgb,var(--ns-line) 70%,transparent); }
html.ns-active .ns-sidebar .reader-recent-link time { text-align:right; font-variant-numeric:tabular-nums; }
html.ns-active .ns-sidebar :is(.reader-favorite-link,.reader-recent-link)::before { margin:0; align-self:center; min-width:17px; transform:none; }
html.ns-active .ns-sidebar .reader-recent-link.is-current { box-shadow:inset 2px 0 var(--ns-copper); }
html.ns-active .ns-sidebar .reader-recent-link > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html.ns-active .ns-sidebar :is(.reader-favorites-empty,.reader-recent-empty,.ns-empty) { padding:14px 13px 16px; color:var(--ns-muted); font-size:11px; line-height:1.7; }
html.ns-active .ns-module-head { min-height:48px; gap:8px; padding:13px 12px; border-color:var(--ns-line); }
html.ns-active .ns-module-head h2 { gap:8px; color:var(--ns-copy); font-size:15px; }
html.ns-active .ns-module-head h2 svg { width:20px; height:20px; flex:none; color:var(--ns-copper); }
html.ns-active .ns-module-head > button { padding:3px 0; white-space:nowrap; font-size:10px; }
html.ns-active .ns-change-list { padding:0 12px 8px; }
html.ns-active .ns-change { padding:14px 0 13px 16px; border-bottom:1px solid var(--ns-line); }
html.ns-active .ns-change:last-child { border-bottom:0; }
html.ns-active .ns-change::before { left:0; top:18px; width:5px; height:5px; background:var(--ns-copper); }
html.ns-active .ns-change time { font-size:10px; color:var(--ns-muted); }
html.ns-active .ns-change strong { margin-top:4px; color:var(--ns-copy); font-size:12px; }
html.ns-active .ns-change p { margin-top:5px; color:var(--ns-muted); font-size:11px; line-height:1.65; }
html.ns-active .ns-quiz-card { min-height:202px; margin-top:0; overflow:hidden; background:#111612; }
html.ns-active .ns-quiz-card::before { content:''; position:absolute; inset:0 30% 0 0; background:url('../images/nightshift-quiz.webp') left center / auto 100% no-repeat; mask-image:linear-gradient(90deg,#000 48%,transparent); pointer-events:none; }
html.ns-active .ns-quiz-copy { position:relative; margin-left:38%; padding:18px 12px 18px 2px; background:linear-gradient(90deg,#11161288,#111612f5 26%); }
html.ns-active .ns-quiz-copy h2 { gap:6px; font-size:15px; }
html.ns-active .ns-quiz-copy h2 svg { flex:none; width:18px; height:18px; }
html.ns-active .ns-quiz-copy p { line-height:1.55; }
html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading) > span:not(.arrow) { white-space:nowrap; }
html.ns-active .ns-footer { padding:12px 28px; background:var(--ns-ink); }
html.ns-active.ns-home .content > .content-page { padding:24px 36px; }
html.ns-active .content-page { animation:ns-article-enter .28s ease-out both; }
html.ns-active .content-page .page-hero-banner { gap:18px; padding:4px 0 24px; margin:0 0 24px; border:0; border-bottom:1px solid var(--ns-line); border-radius:0; background:transparent; box-shadow:none; }
html.ns-active .content-page .page-hero-banner::before,html.ns-active .content-page .page-hero-banner::after { display:none; }
html.ns-active .content-page .phb-logo { width:54px !important; height:54px !important; padding:0 !important; object-fit:contain; background:transparent !important; background-image:none !important; border:0 !important; border-radius:50% !important; box-shadow:none !important; filter:none; flex:none; }
html.ns-active .content-page .page-title { margin:4px 0; font-size:30px; line-height:1.25; letter-spacing:-.6px; }
html.ns-active .content-page .page-badge { display:block; width:fit-content; margin:0; padding:0; border:0; border-radius:0; background:none; font-size:10px; font-weight:700; letter-spacing:.15em; color:var(--ns-copper); }
html.ns-active .content-page .phb-sub { font-size:13px; font-weight:400; color:var(--ns-muted); }
html.ns-active .content-page .reg-intro { margin-bottom:12px; padding:18px 20px; border:1px solid var(--ns-line); border-radius:9px; background:color-mix(in srgb,var(--ns-panel) 92%,transparent); box-shadow:none; }
html.ns-active .content-page .reg-intro:has(h3) { border-left:2px solid color-mix(in srgb,var(--ns-copper) 35%,var(--ns-line)); }
html.ns-active .content-page .reg-intro > h3 { margin-block:6px 9px; }
html.ns-active .reader-article-tools { padding-bottom:17px; margin-bottom:22px; }
html.ns-active .reader-settings-hint { border-radius:6px; }
/* The original navigation remains live, but its presentation belongs to this frame. */
html.ns-active #sidebar { display:flex; position:absolute; z-index:40; left:0; top:var(--ns-header); bottom:var(--ns-footer); width:var(--ns-nav); min-width:0; max-width:100%; height:auto; margin:0; border:0; border-right:1px solid var(--ns-line); border-radius:0; background:var(--ns-ink); transform:translateX(-100%); opacity:0; visibility:hidden; pointer-events:none; overflow:hidden; transition:transform .26s cubic-bezier(.2,.7,.2,1),opacity .18s,visibility .26s; box-shadow:none; }
html.ns-active.ns-nav-open #sidebar { transform:translateX(0); opacity:1; visibility:visible; pointer-events:auto; }
html.ns-active #sidebar .sidebar-header { display:flex; align-items:center; justify-content:space-between; padding:18px 17px 12px; min-height:64px; border:0; background:transparent; }
html.ns-active #sidebar .sidebar-header::before,html.ns-active #sidebar .sidebar-header::after,html.ns-active #sidebar .logo-icon,html.ns-active #sidebar .season-label { display:none; }
html.ns-active #sidebar .logo-text { color:var(--ns-copy); font-size:17px; font-weight:700; letter-spacing:-.2px; }
html.ns-active #sidebarCloseBtn { display:grid; place-items:center; width:28px; height:28px; padding:0; border:1px solid var(--ns-line); border-radius:6px; background:var(--ns-panel); color:var(--ns-muted); font-size:15px; cursor:pointer; }
html.ns-active #sidebar :is(.season-toggle-sidebar,.season-effect-sidebar,.pq-menu,.reader-updates-open) { display:none !important; }
html.ns-active #sidebar .nav { flex:1; min-height:0; padding:0 10px 16px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-gutter:stable; }
html.ns-active #sidebar .nav-list { padding:0; margin:0; }
html.ns-active #sidebar .nav-section-label { display:flex; align-items:center; gap:8px; min-height:20px; margin:22px 8px 8px; padding:0; border:0; border-radius:0; background:transparent; color:var(--ns-muted); font-size:10px; font-weight:650; letter-spacing:.13em; }
html.ns-active #sidebar .nav-list > .nav-section-label:first-of-type { margin-top:10px; }
html.ns-active #sidebar .nav-section-line { opacity:.4; background:var(--ns-line); }
html.ns-active #sidebar .nav-section-label::before { width:17px; height:18px; flex-basis:17px; }
html.ns-active #sidebar .nav-section-label::after { width:18px; height:22px; flex-basis:18px; margin:0; opacity:.6; }
html.ns-active #sidebar :is(.nav-item,.nav-group-header) { display:flex; align-items:center; position:relative; gap:11px; min-height:41px; padding:11px 10px; margin:2px 0; border:0; border-radius:7px; background:transparent; color:var(--ns-muted); font-size:12px; font-weight:500; line-height:1.4; box-shadow:none; transition:background .18s,color .18s; cursor:pointer; }
html.ns-active #sidebar :is(.nav-item,.nav-group-header)::before,html.ns-active #sidebar :is(.nav-item,.nav-group-header)::after { display:none; }
html.ns-active #sidebar :is(.nav-item,.nav-group-header):hover { background:color-mix(in srgb,var(--ns-copper) 7%,transparent); color:var(--ns-copy); }
html.ns-active #sidebar .nav-item.active { background:color-mix(in srgb,var(--ns-copper) 14%,var(--ns-ink)); color:var(--ns-copy); font-weight:600; box-shadow:inset 2px 0 var(--ns-copper); }
html.ns-active #sidebar .nav-label { min-width:0; flex:1; white-space:normal; transition:transform .18s; }
html.ns-active #sidebar :is(.nav-item,.nav-group-header):hover .nav-label { transform:translateX(2px); }
html.ns-active #sidebar .nav-icon { display:grid; place-items:center; width:19px; height:20px; flex:none; color:var(--ns-copper); font-size:15px; }
html.ns-active #sidebar .nav-icon svg { width:18px; height:18px; }
html.ns-active #sidebar .color-dot { width:7px; height:7px; margin-inline:6px; flex:none; }
html.ns-active #sidebar .arrow { display:flex; margin-left:2px; padding:0; width:14px; color:var(--ns-muted); font-size:0; transform:rotate(0); transition:transform .22s; }
html.ns-active #sidebar .arrow svg { width:14px; height:14px; }
html.ns-active #sidebar .nav-group-header.collapsed .arrow { transform:rotate(-90deg); }
html.ns-active #sidebar .ns-group-count { display:block; min-width:19px; padding:1px 5px; border-radius:4px; background:var(--ns-panel); color:var(--ns-muted); font-size:10px; font-weight:500; text-align:center; }
html.ns-active #sidebar .nav-sublist { display:block !important; max-height:1100px; margin:3px 0 8px 16px; padding:0 0 0 9px; border:0; border-left:1px solid var(--ns-line); border-radius:0; background:transparent; opacity:1; visibility:visible; overflow:hidden; transition:max-height .26s ease,opacity .2s,margin .26s; }
html.ns-active #sidebar .nav-sublist.collapsed { max-height:0; margin-block:0; opacity:0; visibility:hidden; pointer-events:none; }
html.ns-active #sidebar .nav-sublist .nav-item { min-height:36px; font-size:11px; padding-block:9px; }
html.ns-active #sidebar .nav-group-header { min-height:47px; margin-block:7px 4px; padding:9px 10px; border:1px solid var(--ns-line); border-radius:8px; background:var(--ns-panel); color:var(--ns-copy); font-weight:600; }
html.ns-active #sidebar .nav-group-header:not(.collapsed) { border-color:color-mix(in srgb,var(--ns-copper) 55%,var(--ns-line)); background:color-mix(in srgb,var(--ns-copper) 9%,var(--ns-panel)); }
html.ns-active #sidebar .nav-group-header .arrow { display:grid; place-items:center; width:26px; height:26px; flex:none; margin-left:0; border:1px solid color-mix(in srgb,var(--ns-copper) 25%,var(--ns-line)); border-radius:6px; background:color-mix(in srgb,var(--ns-copper) 7%,transparent); color:var(--ns-copper); transform:none; }
html.ns-active #sidebar .nav-group-header.collapsed .arrow { transform:none; }
html.ns-active #sidebar .nav-group-header .arrow svg { width:15px; height:15px; transform:rotate(0); transition:transform .22s; }
html.ns-active #sidebar .nav-group-header.collapsed .arrow svg { transform:rotate(-90deg); }
html.ns-active #sidebar .ns-group-count { min-width:21px; padding:2px 4px; background:transparent; color:var(--ns-muted); font-size:10px; }
html.ns-active #sidebar .nav-sublist { margin-left:20px; padding-left:10px; border-left:2px solid color-mix(in srgb,var(--ns-copper) 40%,var(--ns-line)); }
html.ns-active #sidebar .nav-sublist .nav-item { margin-block:4px; padding:10px 8px; background:color-mix(in srgb,var(--ns-panel) 65%,transparent); }
html.ns-active #sidebar .nav-group-header { cursor:default; }
html.ns-active #sidebar .nav-group-header > .arrow { display:none; }
html.ns-active #sidebar .ns-group-toggle { display:grid; place-items:center; flex:none; width:28px; height:28px; padding:0; border:1px solid color-mix(in srgb,var(--ns-copper) 25%,var(--ns-line)); border-radius:6px; background:color-mix(in srgb,var(--ns-copper) 7%,transparent); color:var(--ns-copper); cursor:pointer; }
html.ns-active #sidebar .ns-group-toggle svg { width:15px; height:15px; transition:transform .28s cubic-bezier(.22,.75,.22,1); }
html.ns-active #sidebar .ns-group-toggle[aria-expanded="false"] svg { transform:rotate(-90deg); }
html.ns-active #sidebar .ns-group-toggle:hover { border-color:var(--ns-copper); background:color-mix(in srgb,var(--ns-copper) 16%,transparent); }
html.ns-active #sidebar .ns-group-toggle:focus-visible,html.ns-active #sidebar .nav-label[role="link"]:focus-visible { outline:2px solid var(--ns-copper); outline-offset:2px; }
html.ns-active #sidebar .nav-group-header .nav-label[role="link"] { cursor:pointer; }
html.ns-active #sidebar .nav-sublist { max-height:none; transition:none; }
html.ns-active #sidebar .nav-sublist.collapsed { display:none !important; }
html.ns-active #sidebar .nav-sublist.ns-sublist-animating { display:block !important; max-height:none; visibility:visible; overflow:hidden; }
/* Department colours retain the original unit identities in both themes. */
html.ns-active [data-ns-unit="fto"] { --ns-unit-color:#4ade80; --ns-unit-label:#4ade80; }
html.ns-active [data-ns-unit="aiad"] { --ns-unit-color:#f87171; --ns-unit-label:#f87171; }
html.ns-active [data-ns-unit="sahp"] { --ns-unit-color:#fbbf24; --ns-unit-label:#fbbf24; }
html.ns-active [data-ns-unit="dea"] { --ns-unit-color:#1e40af; --ns-unit-label:#93c5fd; }
html.ns-active [data-ns-unit="sru"] { --ns-unit-color:#c084fc; --ns-unit-label:#c084fc; }
html.ns-active [data-ns-unit="swat"],html.ns-active [data-ns-unit="dtu"] { --ns-unit-color:#111827; --ns-unit-label:#cbd5e1; }
html.ns-active .content-page [data-ns-unit] { border-left:3px solid var(--ns-unit-color) !important; border-radius:9px; box-shadow:none; }
html.ns-active .content-page [data-ns-unit] .reg-kicker { color:var(--ns-unit-label) !important; }
html.ns-active .content-page [data-ns-unit] .unit-tag { background:color-mix(in srgb,var(--ns-unit-color) 16%,var(--ns-panel)); color:var(--ns-unit-label); border:1px solid color-mix(in srgb,var(--ns-unit-label) 30%,transparent); font-size:11px; padding:4px 9px; letter-spacing:.06em; }
html.ns-active .ns-unit-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
html.ns-active .ns-unit-heading .reg-kicker { margin:0; font-size:9px; letter-spacing:.12em; }
html.ns-active .content-page .ns-unit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
html.ns-active .content-page .ns-unit-grid > .reg-intro { margin:0; padding:20px; }
html.ns-active .content-page .ns-unit-grid > .reg-intro h3 { margin:0 0 12px; font-size:16px; line-height:1.5; }
html.ns-active .content-page .ns-unit-grid > .reg-intro p { margin:0; color:var(--ns-muted); line-height:1.7; }
html.ns-active #sidebar .sidebar-kadet-bar { padding:10px; border:0; border-top:1px solid var(--ns-line); background:transparent; }
html.ns-active #sidebar .kadet-mode-toggle { padding:12px; margin:0; border:1px solid var(--ns-line); border-radius:8px; background:var(--ns-panel); box-shadow:none; }
html.ns-active #sidebar .kadet-mode-effect,html.ns-active #sidebar .kadet-test-launch { display:none; }
html.ns-active #sidebar .kadet-mode-sub { padding:8px 0 0; margin:0; font-size:10px; line-height:1.55; color:var(--ns-muted); }
html.ns-active #sidebar .kadet-mode-label { font-size:12px; }
html.halloween.ns-active #sidebar .pq-egg-crest { top:16px; bottom:auto; right:52px; width:30px; min-width:30px; height:30px; }
html.halloween.ns-active #sidebar .pq-egg-crest .pq-egg-art { width:28px; height:28px; }
html.halloween.ns-active #sidebar .nav-section-label:has(.pq-egg-menu) { min-height:30px; }
html.halloween.ns-active #sidebar .pq-egg-menu { top:0; right:30px; width:30px; min-width:30px; height:30px; }
html.halloween.ns-active #sidebar .pq-egg-menu .pq-egg-art { width:28px; height:28px; }
html.ns-active .ns-drawer-shade { display:none; }
html.ns-active #sidebarOverlay,html.ns-active .lspd-site-credit { display:none !important; }
html.ns-active.reader-focus .ns-rail,html.ns-active.reader-focus .ns-sidebar { display:none; }
html.ns-active.reader-focus .main-wrapper { grid-template-columns:0px minmax(0,1fr) 0px; }
html.ns-active.reader-focus #sidebar { display:none !important; }
html.ns-active.reader-focus .main-wrapper > .content { width:100%; max-width:1180px; justify-self:center; }
html.ns-active.reader-focus .topbar { grid-template-columns:auto minmax(140px,1fr) auto; }
html.ns-active .academy-staff-bar { position:absolute; top:var(--ns-header); left:0; right:0; z-index:30; }
html.ns-active :is([data-ns-action],[data-ns-page],.ns-profile button,.ns-footer button,#sidebar [tabindex="0"]):focus-visible { outline:2px solid var(--ns-copper); outline-offset:2px; }
@keyframes ns-article-enter { from { opacity:.25; transform:translateY(7px); } to { opacity:1; transform:none; } }
@keyframes ns-night-rain { from { transform:scale(1); } to { transform:scale(1.035) translateY(2px); } }
html.halloween.ns-active[data-season-effects="full"] .ns-hero-media img { animation:ns-night-rain 24s ease-in-out infinite alternate; }
@media (max-width:1450px) {
 html.ns-active { --ns-nav:248px; --ns-aside:288px; --ns-header:74px; --topbar-h:74px; }
 html.ns-active .topbar { padding-inline:20px; gap:18px; }
 html.ns-active .ns-brand { font-size:21px; gap:9px; }
 html.ns-active .ns-brand > img { width:38px; height:38px; }
 html.ns-active .ns-rail-button { font-size:12px; padding-inline:10px; }
 html.ns-active .ns-profile { gap:12px; }
 html.ns-active .ns-profile-toggle { gap:8px; }
 html.ns-active .ns-profile-avatar { width:34px; height:34px; }
 html.ns-active .ns-profile .topbar-user-chip { padding-left:12px; }
 html.ns-active .ns-sidebar { padding-inline:18px; }
 html.ns-active .ns-sidebar { padding:16px 12px; }
 html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading),html.ns-active .ns-module-head h2 { font-size:14px; }
 html.ns-active .ns-hero-copy { padding:36px 8px 28px 26px; }
 html.ns-active .ns-hero h1 { font-size:37px; }
 html.ns-active .ns-directory { padding-inline:26px; }
 html.ns-active .ns-directory-row { grid-template-columns:40px minmax(110px,.8fr) minmax(110px,1.3fr) 26px; padding-inline:15px; gap:13px; }
 html.ns-active .ns-directory-icon { width:38px; height:38px; }
 html.ns-active .ns-directory-label strong { font-size:15px; }
 html.ns-active .ns-directory-label small { font-size:11px; }
 html.ns-active .ns-directory-desc { font-size:12px; }
 html.ns-active .ns-footer-copy small { display:none; }
}
@media (max-width:1100px) {
 html.ns-active { --ns-header:116px; --topbar-h:116px; --ns-nav:280px; }
 html.ns-active .main-wrapper,html.ns-active.ns-nav-open .main-wrapper { display:block; height:100dvh; overflow:auto; }
 html.ns-active .main-wrapper::before,html.ns-active .main-wrapper.home-full-bg::before { position:fixed; inset:var(--ns-header) 0 0; }
 html.ns-active .topbar { position:sticky; top:0; display:grid; height:var(--ns-header); padding:10px 20px; grid-template-columns:auto minmax(0,1fr) auto; grid-template-rows:46px 40px; gap:8px 20px; }
 html.ns-active .ns-brand { grid-row:1; grid-column:1 / 3; }
 html.ns-active .ns-profile { grid-row:1; grid-column:3; }
 html.ns-active .ns-rail { grid-row:2; grid-column:1; }
 html.ns-active #searchWrap { grid-row:2; grid-column:2 / -1; }
 html.ns-active #searchInput { height:39px; }
 html.ns-active .main-wrapper > .content { min-height:calc(100dvh - var(--ns-header)); overflow:visible; padding:25px; }
 html.ns-active .ns-sidebar { overflow:visible; height:auto; min-height:0; border:0; border-top:1px solid var(--ns-line); padding:25px; }
 html.ns-active .ns-materials { flex:none; overflow:visible; padding:0; }
 html.ns-active .ns-quiz-card { margin-top:0; max-width:440px; }
 html.ns-active .ns-footer { min-height:78px; padding:18px 25px; flex-wrap:wrap; }
 html.ns-active .ns-footer-copy { display:none; }
 html.ns-active .ns-footer-controls { flex-wrap:wrap; gap:12px; }
 html.ns-active #sidebar { position:fixed; top:var(--ns-header); bottom:0; width:var(--ns-nav); z-index:90; box-shadow:12px 0 38px #0003; }
 html.ns-active.ns-nav-open .ns-drawer-shade { display:block; position:fixed; inset:var(--ns-header) 0 0 var(--ns-nav); z-index:80; border:0; background:#0005; cursor:pointer; }
 html.ns-active.reader-focus .topbar { grid-template-columns:auto minmax(0,1fr) auto; }
 html.ns-active.reader-focus #searchWrap { grid-column:1 / -1; }
 html.ns-active .ns-directory-row { grid-template-columns:44px minmax(140px,.8fr) minmax(140px,1.3fr) 30px; }
 html.ns-active .ns-hero-copy { padding:38px 22px 32px 28px; }
 html.ns-active .ns-hero h1 { font-size:45px; }
 html.ns-active .ns-sidebar :is(.reader-favorites-heading,.reader-recent-heading),html.ns-active .ns-module-head h2 { font-size:16px; }
}
@media (min-width:1101px) and (max-width:1250px) {
 html.ns-active.ns-nav-open .ns-hero { grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); }
 html.ns-active.ns-nav-open .ns-hero h1 { font-size:34px; }
 html.ns-active.ns-nav-open .ns-hero-intro { font-size:12px; }
 html.ns-active.ns-nav-open .ns-directory-row { grid-template-columns:38px minmax(0,1fr) 28px; }
 html.ns-active.ns-nav-open .ns-directory-desc { display:none; }
}
@media (min-width:1101px) and (max-height:1000px) {
 html.ns-active .ns-hero { min-height:314px; }
 html.ns-active .ns-hero-copy { padding-top:30px; padding-bottom:24px; }
 html.ns-active .ns-hero h1 { font-size:clamp(32px,2.9vw,48px); }
 html.ns-active .ns-hero-intro { font-size:12px; }
 html.ns-active .ns-directory-row { min-height:78px; padding-block:13px; }
 html.ns-active .ns-sidebar:has(.ns-quiz-card:not([hidden])) :is(.reader-favorites-list,.reader-recent-list) { max-height:116px; }
 html.ns-active .ns-sidebar:has(.ns-quiz-card:not([hidden])) .ns-change p { display:none; }
}
@media (max-width:600px) {
 html.ns-active { --ns-header:114px; --topbar-h:114px; --ns-nav:min(286px,calc(100vw - 45px)); }
 html.ns-active .topbar { padding:8px 14px; gap:6px 10px; grid-template-rows:46px 42px; }
 html.ns-active .ns-brand { font-size:19px; gap:8px; }
 html.ns-active .ns-brand > img { width:34px; height:34px; }
 html.ns-active .ns-profile-name { display:none !important; }
 html.ns-active .ns-profile { gap:7px; }
 html.ns-active .ns-profile-toggle { gap:5px; }
 html.ns-active .ns-profile-avatar { width:31px; height:31px; }
 html.ns-active .ns-profile > #topbarUser .topbar-user-chip { display:none; }
 html.ns-active .ns-profile-popover { width:230px; top:calc(100% + 9px); }
 html.ns-active .ns-rail-button { min-height:38px; padding:8px 9px; gap:6px; font-size:11px; }
 html.ns-active .ns-rail-category { min-height:38px; }
 html.ns-active .ns-category-label { font-size:11px; gap:6px; padding-left:9px; padding-right:3px; }
 html.ns-active .ns-category-label svg { width:16px; height:16px; }
 html.ns-active .ns-category-toggle { min-height:28px; height:28px; width:28px; padding:0; }
 html.ns-active .ns-rail-button[data-ns-action="home"] { display:none; }
 html.ns-active #searchWrap { min-width:0; }
 html.ns-active #searchWrap::before { display:none; }
 html.ns-active #searchInput { height:38px; padding:9px 11px; font-size:12px; }
 html.ns-active #searchWrap #searchInput { padding:9px 11px; }
 html.ns-active .ns-search-key { display:none; }
 html.ns-active #searchIconBtn { display:none; }
 html.ns-active #searchDropdown.reader-search-open { position:fixed; left:10px; right:10px; top:calc(var(--ns-header) + 4px); width:auto; max-height:calc(100dvh - var(--ns-header) - 20px); }
 html.ns-active .ns-hero { display:flex; flex-direction:column; min-height:0; }
 html.ns-active .ns-hero-copy { padding:30px 22px 24px; }
 html.ns-active .ns-hero h1 { font-size:39px; letter-spacing:-1.5px; }
 html.ns-active .ns-kicker { font-size:8px; letter-spacing:.16em; }
 html.ns-active .ns-lead { font-size:17px; max-width:310px; }
 html.ns-active .ns-lead br { display:none; }
 html.ns-active .ns-hero-rule { margin-block:17px 14px; }
 html.ns-active .ns-hero-intro { font-size:12px; max-width:320px; }
 html.ns-active .ns-hero-media { width:100%; height:190px; }
 html.ns-active .ns-hero-media img { object-position:70% 57%; }
 html.ns-active .ns-hero-media::after { background:linear-gradient(0deg,#030609a8,transparent 40%); }
 html.ns-active .ns-hero-media figcaption { right:18px; bottom:15px; }
 html.ns-active .ns-directory { padding:25px 18px 0; }
 html.ns-active .ns-directory-heading { gap:8px; }
 html.ns-active .ns-directory-heading > span { display:none; }
 html.ns-active .ns-directory h2 { font-size:17px; }
 html.ns-active .ns-directory-row { grid-template-columns:38px minmax(0,1fr) 28px; gap:12px; min-height:80px; padding:15px 12px; }
 html.ns-active .ns-directory-desc { display:none; }
 html.ns-active .ns-directory-icon svg { width:25px; height:25px; }
 html.ns-active .main-wrapper > .content { padding:22px 18px 30px; }
 html.ns-active.ns-home .content > .content-page { padding:22px; }
 html.ns-active .content-page .page-title { font-size:27px; }
 html.ns-active .content-page .page-hero-banner { gap:14px; padding:0 0 20px; }
 html.ns-active .content-page .phb-logo { width:45px !important; height:45px !important; }
 html.ns-active .content-page .reg-intro { padding:16px; }
 html.ns-active .content-page .ns-unit-grid { grid-template-columns:1fr; }
 html.ns-active .ns-footer { padding-inline:18px; justify-content:center; }
 html.ns-active .ns-footer-controls { justify-content:center; gap:10px; }
 html.ns-active .ns-footer-controls > button { font-size:11px; }
 html.ns-active .ns-footer-controls > button + button:not(.ns-theme-toggle) { padding-left:10px; }
}
@media (prefers-reduced-motion:reduce) {
 html.ns-active .main-wrapper,html.ns-active #sidebar,html.ns-active #sidebar *,html.ns-active .ns-rail-button,html.ns-active .ns-category-toggle svg,html.ns-active .content-page,html.ns-active .ns-hero-media img,html.ns-active .ns-directory-row,html.ns-active .ns-chevron { animation:none !important; transition:none !important; }
}

/* Direct profile access; staff controls remain outside the account button. */
html.ns-active .topbar { grid-template-columns:auto auto minmax(100px,1fr) auto auto; }
html.ns-active .ns-editor-tools { display:flex; align-items:center; gap:8px; }
html.ns-active .ns-editor-tools:empty { display:none; }
html.ns-active .ns-editor-tools :is(#editPageBtn,#academyModeBtn) { align-items:center; justify-content:center; white-space:nowrap; margin:0; min-height:36px; padding:8px 11px; border:1px solid var(--ns-line); border-radius:8px; background:var(--ns-panel); color:var(--ns-copy); font:inherit; font-size:12px; box-shadow:none; cursor:pointer; transition:background .18s,border-color .18s; }
html.ns-active .ns-editor-tools button:hover { background:color-mix(in srgb,var(--ns-copper) 10%,var(--ns-panel)); border-color:var(--ns-copper); }
html.ns-active .ns-editor-tools #academyModeBtn.is-on { color:var(--ns-signal-warning,#ffd37d); border-color:currentColor; }
html.ns-active .ns-profile-copy { display:flex; flex-direction:column; align-items:flex-start; gap:3px; text-align:left; }
html.ns-active .ns-profile-name { color:var(--ns-copy); line-height:1.3; }
html.ns-active .ns-profile-label { color:var(--ns-copper); font-size:11px; line-height:1.3; }
html.ns-active .ns-profile-toggle { color:var(--ns-copy); border-radius:8px; }
html.ns-active .ns-profile-toggle:hover .ns-profile-label { text-decoration:underline; text-underline-offset:3px; }
html.ns-active.reader-focus .topbar { grid-template-columns:auto auto minmax(100px,1fr) auto auto; }
@media(max-width:1100px) {
 html.ns-active { --ns-header:158px; --topbar-h:158px; }
 html.ns-active .topbar,html.ns-active.reader-focus .topbar { height:var(--ns-header); grid-template-columns:auto minmax(0,1fr) auto; grid-template-rows:46px 40px 34px; gap:7px 14px; }
 html.ns-active .ns-editor-tools { grid-row:3; grid-column:1 / -1; justify-content:flex-end; }
 html.ns-active .ns-editor-tools :is(#editPageBtn,#academyModeBtn) { min-height:30px; padding:5px 10px; }
 html.ns-active .ns-profile { justify-content:flex-end; }
 html.ns-active .ns-profile-name { display:block !important; max-width:110px; font-size:12px; }
 html.ns-active.reader-focus #searchWrap { grid-column:2 / -1; }
 html.ns-active .ns-brand { grid-column:1 / 3; }
}
@media(max-width:600px) {
 html.ns-active .ns-brand { font-size:16px; gap:6px; }
 html.ns-active .ns-brand > img { width:30px; height:30px; }
 html.ns-active .ns-profile-name { max-width:95px; font-size:11px; }
 html.ns-active .ns-profile-label { font-size:10px; }
 html.ns-active .ns-profile .topbar-user-chip { padding-left:7px; }
 html.ns-active .ns-profile > #topbarUser .topbar-user-chip { display:block; border:0; padding:0; }
 html.ns-active .ns-profile .topbar-logout-btn { font-size:10px; }
}
@media(max-width:360px) {
 html.ns-active .ns-brand-copy { max-width:65px; line-height:1.15; }
 html.ns-active .ns-profile-name { max-width:78px; }
}
@media(max-width:1100px) {
 html.ns-active:not(.ns-has-tools) { --ns-header:116px; --topbar-h:116px; }
 html.ns-active:not(.ns-has-tools) .topbar { grid-template-rows:46px 40px; }
 html.ns-active:not(.ns-has-tools) .ns-editor-tools { display:none; }
}
