.rex-hub { --ink: #1c2430; --muted: #5c6770; --line: #d5dbe3; --paper: #f3f5f8; --card: #ffffff; --navy: #0b3a5b; --navy-soft: #e7eef5; --header-bg: #0b3a5b; --header-line: #062b45; --amber: #7a3412; --amber-bg: #f8efe6; --green: #1f6b45; --green-bg: #e7f4ec; --red: #8d2a2a; --red-bg: #f8e8e8; }
.rex-hub * { box-sizing: border-box; }
.rex-hub { margin: 0; color: var(--ink); background: var(--paper); font: 15px/1.45 "Segoe UI", sans-serif; }
.rex-hub .skip { position: absolute; left: 8px; top: -40px; background: var(--navy); color: white; padding: 6px 10px; }
.rex-hub .skip:focus { top: 8px; }
.rex-hub header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; align-items: flex-end; padding: 16px 20px 12px; color: white; background: var(--header-bg); border-bottom: 1px solid var(--header-line); }
.rex-hub h1 { margin: 4px 0 0; font-size: 22px; font-weight: 650; }
.rex-hub h1 .home { color: inherit; text-decoration: none; }
.rex-hub h1 .home:hover, .rex-hub h1 .home:focus-visible { text-decoration: underline; }
.rex-hub h1 .page-name { margin-left: 0.45rem; font-size: 0.72em; font-weight: 450; opacity: 0.9; }
.rex-hub .pages { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; }
.rex-hub .pages a { color: white; text-decoration: none; white-space: nowrap; }
.rex-hub .pages a[aria-current="page"] { font-weight: 650; border-bottom: 2px solid white; }
.rex-hub .intro { max-width: 70ch; color: var(--muted); }
.rex-hub .role-page { padding: 16px 20px 48px; }
.rex-hub .role-link { display: block; padding: 6px 8px; color: var(--navy); }
.rex-hub .role-link:hover { background: var(--navy-soft); }
.rex-hub .role-block { margin: 10px 0 4px 26px; font-size: 14px; }
.rex-hub .role-list { margin: 0 0 8px 44px; }
.rex-hub .role-empty { margin: 0 0 8px 26px; color: var(--muted); }
.rex-hub .role-table-wrap { overflow-x: auto; margin: 0 0 12px 26px; }
.rex-hub .role-processes { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 14px; background: var(--card); }
.rex-hub .role-processes col.process-id { width: 25ch; }
.rex-hub .role-processes col.pillar { width: 40ch; }
.rex-hub .role-processes th, .rex-hub .role-processes td { padding: 6px 8px; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.rex-hub .role-processes th { font-size: 12px; color: var(--muted); font-weight: 600; border-top: 0; }
.rex-hub .role-processes .process-id { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rex-hub .role-processes .role-link { display: inline; padding: 0; }
.rex-hub .role-processes .role-link:hover { background: transparent; text-decoration: underline; }
.rex-hub .banner { margin: 0; color: var(--amber); font-size: 13px; }
.rex-hub .confidential { position: fixed; left: 0; right: 0; bottom: 0; z-index: 10; padding: 6px 20px; background: var(--amber-bg); border-top: 1px solid #e6cdb5; text-align: center; }
.rex-hub { padding-bottom: 34px; }
.rex-hub .tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-width: 0; }
.rex-hub label[for="search"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.rex-hub input[type="search"] { width: 240px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.rex-hub button, .rex-hub .node { font: inherit; color: inherit; }
.rex-hub #reload, .rex-hub .tool-btn, .rex-hub .node { border: 1px solid transparent; background: transparent; border-radius: 6px; cursor: pointer; }
.rex-hub #reload, .rex-hub .tool-btn { padding: 8px 12px; color: var(--ink); border-color: var(--line); background: var(--card); }
.rex-hub #reload:hover, .rex-hub .tool-btn:hover, .rex-hub .node:hover { background: var(--navy-soft); }
.rex-hub .layout { display: grid; grid-template-columns: 360px 1fr; min-height: calc(100vh - 78px); }
.rex-hub { -webkit-text-size-adjust: 100%; }
.rex-hub img, .rex-hub svg, .rex-hub iframe, .rex-hub video { max-width: 100%; }
.rex-hub #tree { min-width: 0; overflow: auto; padding: 10px; border-right: 1px solid var(--line); background: var(--card); }
.rex-hub .app { margin: 0 0 12px; }
.rex-hub .app > .group { margin-left: 8px; }
.rex-hub .group { margin: 0 0 8px; }
.rex-hub .app > .node, .rex-hub .group > .node, .rex-hub .module > .node, .rex-hub .module-row > .node, .rex-hub .area > .node { display: flex; width: 100%; text-align: left; padding: 6px 8px; gap: 8px; align-items: baseline; }
.rex-hub .app > .node { font-weight: 700; color: var(--navy); font-size: 1.05em; border-bottom: 1px solid var(--line, #d8dee6); border-radius: 6px 6px 0 0; }
.rex-hub .group > .node { font-weight: 650; color: var(--navy); }
.rex-hub .placeholder { margin: 6px 8px 4px 30px; font-size: 0.92em; font-style: italic; opacity: 0.8; }
.rex-hub .module { margin-left: 8px; }
.rex-hub .area { margin-left: 18px; }
.rex-hub .module-overview { margin: 0 0 4px 18px; }
.rex-hub .module-files h4, .rex-hub #detail h4 { margin: 12px 0 4px; font-size: 0.95rem; }
.rex-hub .processes { margin: 0 0 4px 28px; padding: 0; list-style: none; }
.rex-hub .process-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; column-gap: 8px; }
.rex-hub .process-row .process { grid-column: 1; grid-row: 1 / span 2; min-width: 0; }
.rex-hub .process-row:has(.support-also) .process { grid-row: 1; }
.rex-hub .process-row .support-also { grid-column: 1 / -1; grid-row: 2; margin: 0 0 4px 1.5rem; }
.rex-hub .process-row .flag { grid-column: 2; padding-top: 4px; }
.rex-hub .process-row .flag:last-child { padding-top: 0; }
.rex-hub .flag { display: flex; align-items: center; gap: 3px; padding-top: 6px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.rex-hub .scope-filter { display: flex; align-items: center; gap: 4px; color: white; font-size: 13px; }
.rex-hub #flag-status { font-size: 12px; }
.rex-hub #flag-status.error { color: #ffd2d2; }
.rex-hub .reload-status { font-size: 12px; color: #d5e4f2; }
.rex-hub .reload-status.error { color: #ffd2d2; }
.rex-hub #reload:disabled { cursor: progress; opacity: 0.7; }
.rex-hub .process { display: block; width: 100%; text-align: left; padding: 6px 8px; border-radius: 6px; }
.rex-hub .process[aria-current="true"] { background: var(--navy); color: white; }
.rex-hub .process[aria-current="true"] .meta { color: #d5e4f2; }
.rex-hub .id { font-variant-numeric: tabular-nums; color: var(--muted); font-size: 12px; }
.rex-hub .process[aria-current="true"] .id { color: #d5e4f2; }
.rex-hub .name { display: block; }
.rex-hub .meta { color: var(--muted); font-size: 12px; }
.rex-hub .shared { margin: 0 0 6px 8px; color: var(--muted); font-size: 13px; }
.rex-hub #detail { padding: 20px 28px 48px; overflow: auto; }
.rex-hub .empty, .rex-hub .error { color: var(--muted); }
.rex-hub .crumb { margin: 0; color: var(--muted); font-size: 13px; }
.rex-hub h2 { margin: 4px 0 8px; font-size: 26px; font-weight: 650; }
.rex-hub .facts { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; }
.rex-hub .facts li, .rex-hub .status { padding: 3px 8px; border-radius: 999px; background: var(--navy-soft); color: var(--navy); font-size: 12px; }
.rex-hub .notes { max-width: 70ch; }
.rex-hub .sources { margin: -6px 0 14px; padding: 0; list-style: none; font-size: 14px; }
.rex-hub .sources li { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin: 2px 0; }
.rex-hub .file-preview { flex-basis: 100%; margin: 4px 0 10px; }
.rex-hub .file-preview iframe { width: 100%; height: 28rem; border: 1px solid #ccc; background: #fff; }
.rex-hub .src-title { color: var(--muted); }
.rex-hub h3 { margin: 28px 0 8px; font-size: 16px; }
.rex-hub .map { overflow: auto; padding: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; }
.rex-hub .map :is(svg) { max-width: none; }
.rex-hub .question { margin: 0 0 12px; padding: 12px 14px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; }
.rex-hub .question header { display: block; padding: 0; border: 0; background: transparent; }
.rex-hub .q-id { margin: 0; font-size: 13px; color: var(--muted); }
.rex-hub .q-text { margin: 4px 0 8px; }
.rex-hub .status.Unanswered { background: var(--paper); color: var(--muted); }
.rex-hub .status.Captured { background: var(--green-bg); color: var(--green); }
.rex-hub .status.Stale { background: var(--red-bg); color: var(--red); }
.rex-hub .answer { margin: 8px 0 0; white-space: pre-wrap; }
.rex-hub .answer-meta { margin: 6px 0 0; color: var(--muted); font-size: 13px; }
.rex-hub .answer-edit, .rex-hub .answer-form button { padding: 7px 11px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; background: var(--card); cursor: pointer; }
.rex-hub .answer-edit:hover, .rex-hub .answer-form button:hover { background: var(--navy-soft); }
.rex-hub .answer-form { display: grid; gap: 10px; margin-top: 12px; }
.rex-hub .answer-field { display: grid; gap: 4px; font-weight: 600; }
.rex-hub .answer-field :is(input, textarea, select) { width: 100%; padding: 8px 10px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; background: white; font: inherit; font-weight: 400; }
.rex-hub .answer-form-controls { display: flex; gap: 8px; }
.rex-hub .answer-form button:disabled { cursor: wait; opacity: 0.65; }
.rex-hub .save-message { min-height: 1.45em; margin: 0; }
.rex-hub .save-message.success { color: var(--green); }
.rex-hub .save-message.error { color: var(--red); }
.rex-hub .ts-note { margin: 0 0 10px; color: var(--muted); font-size: 13px; max-width: 80ch; }
.rex-hub .test-script { margin: 0 0 12px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; }
.rex-hub .test-script > summary { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; padding: 10px 14px; cursor: pointer; }
.rex-hub .test-script[open] > summary { border-bottom: 1px solid var(--line); }
.rex-hub .ts-name { font-weight: 600; }
.rex-hub .ts-facts { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; margin: 10px 14px; font-size: 14px; }
.rex-hub .ts-facts dt { color: var(--muted); }
.rex-hub .ts-facts dd { margin: 0; }
.rex-hub .ts-table-wrap { overflow-x: auto; padding: 0 14px 12px; }
.rex-hub .ts-steps { width: 100%; border-collapse: collapse; font-size: 14px; }
.rex-hub .ts-steps th, .rex-hub .ts-steps td { padding: 6px 8px; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.rex-hub .ts-steps th { font-size: 12px; color: var(--muted); font-weight: 600; border-top: 0; }
.rex-hub .ts-steps td:first-child, .rex-hub .ts-steps td:last-child { white-space: nowrap; }
.rex-hub .ts-small { margin-top: 2px; color: var(--muted); font-size: 12px; }
.rex-hub .release-page { padding: 16px 24px 48px; max-width: 960px; }
.rex-hub .release-page h2, .rex-hub .release-page h3, .rex-hub .release-page h4 { margin: 1.2em 0 0.4em; }
.rex-hub .release-page details { margin: 0.4em 0; }
.rex-hub .release-page summary { cursor: pointer; }
@media (max-width: 800px) { .rex-hub header { flex-direction: column; align-items: stretch; }
.rex-hub .layout, .rex-hub .layout.split { grid-template-columns: 1fr; }
.rex-hub #splitter { display: none; }
.rex-hub #tree { max-height: 40vh; border-right: 0; border-bottom: 1px solid var(--line); }
.rex-hub input[type="search"] { flex: 1 1 100%; width: 100%; } }
.rex-hub .steps { margin: 0; padding: 0; list-style: none; }
.rex-hub .step-row { display: flex; align-items: baseline; gap: 10px; padding: 4px 0; border-top: 1px solid var(--line); }
.rex-hub .step-row .flag { padding-top: 0; }
.rex-hub .module-row { display: flex; align-items: center; gap: 0.75rem; }
.rex-hub .module-row > .node { flex: 1; min-width: 0; width: auto; }
.rex-hub .module-flag { white-space: nowrap; }
.rex-hub #splitter { cursor: col-resize; background: var(--line); touch-action: none; }
.rex-hub #splitter:hover, .rex-hub #splitter.dragging, .rex-hub #splitter:focus-visible { background: var(--navy); outline: none; }
.rex-hub.resizing { user-select: none; cursor: col-resize; }
.rex-hub .layout.split { grid-template-columns: var(--tree-w, 360px) 8px minmax(0, 1fr); }
.rex-hub header > div:first-child { min-width: 0; }
.rex-hub header > div:first-child:has(.logo) { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.rex-hub header .logo { grid-row: 1 / span 2; height: 64px; width: auto; padding: 3px 8px; background: white; border-radius: 10px; }
@media (max-width: 800px) { .rex-hub .layout.split { grid-template-columns: 1fr; }
.rex-hub #splitter { display: none; } }
.rex-hub .upload-page { padding: 1rem 1.5rem; max-width: 60rem; }
.rex-hub .dropzone { border: 2px dashed #0b3a5b; border-radius: 8px; padding: 1.5rem; text-align: center; background: #fff; }
.rex-hub .dropzone.over { background: #e6f0f7; }
.rex-hub .dropzone.disabled { opacity: .5; }
.rex-hub .dropzone input[type=file] { margin-top: .5rem; }
.rex-hub .dropzone .muted { color: #555; font-size: .85rem; }
.rex-hub .upload-page table { border-collapse: collapse; width: 100%; background: #fff; }
.rex-hub .upload-page th, .rex-hub .upload-page td { text-align: left; padding: .35rem .6rem; border-bottom: 1px solid #ddd; }
.rex-hub .upload-fields { display: flex; gap: 1rem; flex-wrap: wrap; }
.rex-hub .upload-fields input { margin-left: .4rem; padding: .3rem; }
.rex-hub .versions { background: #eef5fa; border-left: 4px solid #0b3a5b; padding: .3rem .9rem; margin: .8rem 0; }
.rex-hub .about-page { padding: 1rem 1.5rem; max-width: 52rem; line-height: 1.5; }
.rex-hub .about-page li { margin: .4rem 0; }
.rex-hub .about-page .muted { color: #555; font-size: .9rem; }
.rex-hub .crumbs { margin: 0 0 14px; color: var(--muted); }
.rex-hub .crumbs a { color: var(--navy); }
.rex-hub .crumbs .sep { margin: 0 6px; }
.rex-hub .tile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.rex-hub .tile-group { margin: 22px 0 8px; font-size: 1.05rem; color: var(--navy); }
.rex-hub .tile { display: flex; flex-direction: column; gap: 4px; min-height: 96px; padding: 12px 14px; background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--navy); border-radius: 6px; color: var(--ink); text-decoration: none; }
.rex-hub a.tile:hover, .rex-hub a.tile:focus-visible { background: var(--navy-soft); }
.rex-hub .tile.in-scope { border-left-color: var(--green); }
.rex-hub .tile.planned { border-left-color: var(--line); color: var(--muted); }
.rex-hub .tile-id { font-size: 0.8rem; font-weight: 600; color: var(--muted); }
.rex-hub .tile-name { font-weight: 600; }
.rex-hub .tile-meta { margin-top: auto; font-size: 0.85rem; color: var(--muted); }
.rex-hub [hidden] { display: none !important; }
.rex-hub .view-toggle { display: inline-flex; gap: 0; }
.rex-hub .view-toggle .tool-btn { border-radius: 0; }
.rex-hub .view-toggle .tool-btn:first-child { border-radius: 4px 0 0 4px; }
.rex-hub .view-toggle .tool-btn:last-child { border-radius: 0 4px 4px 0; border-left: 0; }
.rex-hub .view-toggle .tool-btn[aria-pressed="true"] { background: var(--navy); color: #fff; }
.embed .rex-hub > header, .embed .rex-hub > footer, .embed .rex-hub > .skip, .embed .rex-hub #tree, .embed .rex-hub #splitter { display: none; }
.embed .rex-hub .layout, .embed .rex-hub .layout.split { grid-template-columns: 1fr; }
.embed .rex-hub { padding-bottom: 0; }
.single .rex-hub #tree, .single .rex-hub #splitter { display: none; }
.single .rex-hub .layout, .single .rex-hub .layout.split { grid-template-columns: minmax(0, 1fr); }
.single .rex-hub #detail { max-width: 1200px; margin: 0 auto; width: 100%; box-sizing: border-box; }
.rex-hub .process-bar { display: none; }
.single .rex-hub .process-bar { display: flex; flex-wrap: wrap; gap: 18px; justify-content: space-between; max-width: 1200px; margin: 0 auto; padding: 12px 20px 0; font-size: 14px; box-sizing: border-box; }
.single .rex-hub .process-bar a { color: var(--accent, #0b3a5b); }
.rex-hub .process-frame { width: 100%; height: calc(100vh - 190px); min-height: 420px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); }
.rex-hub .qa-page { padding: 1rem 1.5rem; max-width: 60rem; }
.rex-hub .qa-app > summary, .rex-hub .qa-pillar > summary { cursor: pointer; font-weight: 600; margin: .4rem 0; }
.rex-hub .qa-pillar, .rex-hub .qa-module { margin-left: 1rem; }
.rex-hub .qa-module > summary { cursor: pointer; margin: .3rem 0; }
.rex-hub .qa-body { margin: .4rem 0 .8rem 1rem; display: grid; gap: .6rem; }
.rex-hub .qa-history, .rex-hub .answer-history ol { margin: .4rem 0 .4rem 1.2rem; padding: 0; }
.rex-hub .qa-history li, .rex-hub .answer-history li { margin-bottom: .5rem; }
.rex-hub .answer-history summary { cursor: pointer; color: var(--muted); font-size: 13px; margin-top: 6px; }
.rex-hub .answer-form label, .rex-hub .answer-field { display: grid; gap: 4px; font-size: 13px; }
.rex-hub .interview-files { margin: .4rem 0 0; padding-left: 1.2rem; }
.rex-hub .relevance { display: inline-block; margin-left: .4rem; padding: 0 .4rem; border-radius: 4px; font-size: 12px; }
.rex-hub .relevance.relevant { background: var(--green-bg); color: var(--green); }
.rex-hub .relevance.not_relevant { background: var(--red-bg); color: var(--red); }
.rex-hub .relevance.pending { background: var(--amber-bg); color: var(--amber); }
.rex-hub .maps-page { padding: 1rem 1.5rem; }
.rex-hub .map-crumbs { margin-bottom: .5rem; }
.rex-hub .map-box { overflow: auto; background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: .5rem; }
.rex-hub .map-box svg { max-width: none; }
.rex-hub .map-links { margin-top: 1rem; }
.rex-hub .map-scope { display: inline-block; margin: .3rem 0; }
@media (max-width: 600px) { .rex-hub { padding-bottom: 64px; }
.rex-hub header { padding: 12px 14px 10px; }
.rex-hub h1 { font-size: 19px; }
.rex-hub h2 { font-size: 22px; }
.rex-hub #detail { padding: 14px 14px 40px; }
.rex-hub #detail.hub-page { padding: 0; }
.rex-hub .role-page, .rex-hub .release-page { padding-left: 14px; padding-right: 14px; }
.rex-hub .upload-page, .rex-hub .about-page, .rex-hub .qa-page, .rex-hub .maps-page { padding-left: 14px; padding-right: 14px; }
.rex-hub .role-block, .rex-hub .role-empty, .rex-hub .role-table-wrap { margin-left: 8px; }
.rex-hub .role-list { margin-left: 24px; }
.rex-hub .processes { margin-left: 12px; }
.rex-hub .confidential { padding: 6px 12px; }
.rex-hub .tile-grid { grid-template-columns: 1fr; }
.rex-hub .ts-facts { grid-template-columns: 1fr; }
.rex-hub .file-preview iframe { height: 20rem; }
.rex-hub .qa-pillar, .rex-hub .qa-module { margin-left: .4rem; }
.rex-hub .qa-body { margin-left: .4rem; }
.rex-hub .hub { grid-template-columns: 1fr; }
.rex-hub .hub-nav, .rex-hub .hub-rail { border: 0; max-height: none; } }
.rex-hub #detail.hub-page { padding: 0; overflow: hidden; }
.rex-hub .hub { display: grid; grid-template-columns: var(--cap-w, 17rem) 8px minmax(0, 1fr) 16rem; min-height: calc(100vh - 8rem); }
.rex-hub .hub-split { cursor: col-resize; background: var(--line); touch-action: none; }
.rex-hub .hub-split:hover, .rex-hub .hub-split.dragging, .rex-hub .hub-split:focus-visible { background: var(--navy); outline: none; }
.rex-hub .hub-nav, .rex-hub .hub-rail { background: var(--card); overflow: auto; max-height: calc(100vh - 8rem); }
.rex-hub .hub-nav { border-right: 1px solid var(--line); }
.rex-hub .hub-rail { border-left: 1px solid var(--line); padding: 16px; }
.rex-hub .hub-nav-head, .rex-hub .hub-rail-title { display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 14px 12px 8px; font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.rex-hub .hub-badge, .rex-hub .hub-count { font-size: 11px; background: var(--navy-soft); color: var(--navy); border-radius: 999px; padding: 1px 7px; }
.rex-hub .hub-nav-list { display: grid; gap: 2px; padding: 0 8px 16px; }
.rex-hub .hub-nav-btn { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; padding: 6px 8px; border-radius: 6px; color: inherit; text-decoration: none; }
.rex-hub .hub-nav-btn:hover, .rex-hub .hub-nav-btn:focus-visible { background: var(--navy-soft); }
.rex-hub .hub-nav-btn.is-current { background: var(--navy); color: white; }
.rex-hub .hub-nav-btn.is-current .hub-count { background: transparent; color: white; }
.rex-hub .hub-config { font-weight: 650; }
.rex-hub .hub-sub { margin-left: 12px; }
.rex-hub .hub-sub2 { margin-left: 24px; font-size: 13px; }
.rex-hub .hub-nav-label { min-width: 0; }
.rex-hub .hub-main { padding: 18px 22px 40px; overflow: auto; max-height: calc(100vh - 8rem); }
.rex-hub .hub-crumbs { margin: 0 0 4px; color: var(--muted); font-size: 13px; }
.rex-hub .hub-crumbs a { color: var(--navy); }
.rex-hub .hub-sep { margin: 0 6px; }
.rex-hub .hub-title { margin: 0 0 12px; font-size: 1.4rem; }
.rex-hub .hub-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.rex-hub .hub-pill { border: 1px solid var(--line); background: var(--card); color: var(--ink); border-radius: 6px; padding: 4px 10px; cursor: pointer; }
.rex-hub .hub-pill.is-current { background: var(--navy); color: white; border-color: var(--navy); }
.rex-hub .hub-search { width: min(36rem, 100%); margin: 0 0 16px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--ink); }
.rex-hub .hub-section { margin: 0 0 10px; font-size: 1rem; }
.rex-hub .hub-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-bottom: 18px; }
.rex-hub .hub-card { display: grid; gap: 4px; padding: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; text-decoration: none; color: inherit; }
.rex-hub .hub-card:hover, .rex-hub .hub-card:focus-visible { border-color: var(--navy); }
.rex-hub .hub-card-id { font-size: 12px; color: var(--navy); }
.rex-hub .hub-card-name { font-weight: 650; }
.rex-hub .hub-card-meta, .rex-hub .hub-note { color: var(--muted); font-size: 13px; }
.rex-hub .hub-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--card); max-height: 28rem; }
.rex-hub .hub-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.rex-hub .hub-table th { text-align: left; background: var(--navy); color: white; padding: 8px 10px; position: sticky; top: 0; }
.rex-hub .hub-table td { padding: 8px 10px; border-top: 1px solid var(--line); vertical-align: top; }
.rex-hub .hub-table a { color: var(--navy); }
.rex-hub .hub-also { margin-top: 4px; }
.rex-hub .hub-also ul { margin: 4px 0 0; padding-left: 1.1rem; }
.rex-hub .hub-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rex-hub .hub-metric { display: grid; gap: 2px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.rex-hub .hub-metric-n { font-size: 1.4rem; font-weight: 700; }
@media (max-width: 900px) { .rex-hub .hub { grid-template-columns: 1fr; }
.rex-hub .hub-split { display: none; }
.rex-hub .hub-nav, .rex-hub .hub-rail, .rex-hub .hub-main { max-height: none; } }
.rex-hub a.tool-btn { display: inline-block; text-decoration: none; color: inherit; }
.rex-hub .view-toggle a.tool-btn[aria-pressed="true"] { color: #fff; }
.rex-hub .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rex-hub .banner { color: var(--ink); font-weight: 600; }
.rex-hub .banner .asof { margin-left: 1rem; font-weight: 400; color: var(--muted); }
.rex-hub .site-search { position: relative; margin-top: 8px; max-width: 460px; }
.rex-hub .site-search input { width: 100%; padding: 7px 10px; border: 1px solid var(--header-line); border-radius: 6px; font: inherit; color: var(--ink); background: white; }
.rex-hub .site-results { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 2px); max-height: 60vh; overflow-y: auto; background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18); }
.rex-hub .site-results[hidden] { display: none; }
.rex-hub .site-results a { display: grid; grid-template-columns: 9em 1fr; gap: 2px 8px; padding: 7px 10px; color: inherit; text-decoration: none; border-bottom: 1px solid var(--line); }
.rex-hub .site-results a:hover, .rex-hub .site-results a:focus-visible { background: var(--navy-soft); outline: none; }
.rex-hub .site-results .id { color: var(--navy); font-weight: 600; }
.rex-hub .site-results .meta { grid-column: 2; color: var(--muted); font-size: 12px; }
.rex-hub .site-none { margin: 0; padding: 10px; color: var(--muted); }
.rex-hub .orient { margin: 12px 20px 0; padding: 8px 14px; background: var(--card); border: 1px solid var(--line); border-radius: 6px; max-width: 80rem; }
.rex-hub .orient summary { cursor: pointer; font-weight: 600; }
.rex-hub .orient ul { margin: 8px 0 4px 18px; padding: 0; }
.rex-hub .orient li { margin: 3px 0; }
.embed .rex-hub .orient { display: none; }
.rex-hub .scope-label { margin-left: auto; padding: 1px 8px; border-radius: 10px; font-size: 12px; background: var(--green-bg); color: var(--green); }
.rex-hub .scope-label.out { background: var(--red-bg); color: var(--red); }
.rex-hub .copy-link { margin: 16px 0 4px; }
.rex-hub .copy-link span { color: var(--muted); font-size: 13px; word-break: break-all; }
.rex-hub .training-files { list-style: none; margin: 4px 0 6px 0; padding: 0; }
.rex-hub .training-files li { display: flex; gap: 12px; align-items: baseline; padding: 2px 0; }
.rex-hub .training-proc { list-style: none; padding: 6px 0 6px 12px; border-bottom: 1px solid var(--line); }
.rex-hub .training-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.rex-hub .training-head .id { color: var(--navy); font-weight: 600; }
.rex-hub .training-none { margin: 2px 0 0; font-size: 13px; }
.rex-hub .training-module { margin: 6px 0 6px 20px; }
.rex-hub .training-module h4 { margin: 4px 0; }
.rex-hub #training-tree { max-width: 80rem; }
.rex-hub .about-body { max-width: 52rem; margin: 20px; line-height: 1.55; }
.rex-hub .about-body h2 { margin-top: 1.6rem; }
@media print { .rex-hub header, .rex-hub footer, .rex-hub .skip, .rex-hub #tree, .rex-hub #splitter, .rex-hub .orient, .rex-hub .copy-link, .rex-hub .tools { display: none !important; }
.rex-hub { background: white; padding: 0; }
.rex-hub .layout, .rex-hub .layout.split { display: block; height: auto; }
.rex-hub main#detail { overflow: visible; height: auto; } }
@media (max-width: 800px) { .rex-hub .orient { margin: 10px 12px 0; }
.rex-hub .about-body { margin: 14px 12px; }
.rex-hub .site-search { max-width: none; } }
.rex-hub a:focus-visible, .rex-hub button:focus-visible, .rex-hub input:focus-visible, .rex-hub summary:focus-visible, .rex-hub select:focus-visible { outline: 3px solid #f2b705; outline-offset: 2px; }
.rex-hub .role-page, .rex-hub #training-tree { overflow-wrap: anywhere; }
.rex-hub .brand-row { display: flex; gap: 14px; align-items: center; }
.rex-hub .brand-logo { display: block; flex: none; }
.rex-hub .brand-logo .logo { display: block; height: 48px; width: auto; padding: 3px 8px; background: #fff; border-radius: 10px; }
.rex-hub .brand-row h1 { margin: 0; }
.rex-hub .brand-tag { margin: 1px 0 0; font-size: 13px; letter-spacing: 0.04em; opacity: 0.85; }
.rex-hub header > div:first-child { min-width: 0; }
.rex-hub header > div:first-child, .rex-hub header > div:first-child:has(.logo) { display: flex; flex: 1 1 100%; flex-wrap: wrap; align-items: center; gap: 8px 28px; }
.rex-hub header > div:first-child nav.pages { margin: 0; }
.rex-hub header .brand-row .logo { grid-row: auto; }
.rex-hub header > div:first-child .site-search { flex: 1 1 280px; margin: 0; max-width: 460px; }
.rex-hub .home { max-width: 62rem; }
.rex-hub .home h2 { margin: 2px 0 6px; font-size: 28px; }
.rex-hub .home h3 { margin: 26px 0 6px; }
.rex-hub .home-kicker { margin: 0; color: var(--muted); font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; }
.rex-hub .home-lead { margin: 0 0 14px; max-width: 46rem; font-size: 16px; }
.rex-hub .home-note { margin: 0 0 10px; color: var(--muted); }
.rex-hub .home-stats { display: flex; flex-wrap: wrap; gap: 12px; margin: 14px 0 0; padding: 0; list-style: none; }
.rex-hub .home-stats li { display: flex; flex-direction: column; min-width: 8.5rem; padding: 10px 16px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; }
.rex-hub .home-stats strong { font-size: 26px; line-height: 1.1; color: var(--navy); }
.rex-hub .home-stats span { color: var(--muted); font-size: 13px; }
.rex-hub .home-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 12px; }
.rex-hub .home-card { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; color: inherit; text-decoration: none; background: var(--card); border: 1px solid var(--line); border-radius: 8px; }
.rex-hub .home-card:hover, .rex-hub .home-card:focus-visible { border-color: var(--navy); background: var(--navy-soft); }
.rex-hub .home-card-id { color: var(--navy); font-weight: 600; font-size: 13px; }
.rex-hub .home-card-name { font-weight: 600; font-size: 16px; }
.rex-hub .home-card-meta { color: var(--muted); font-size: 13px; }
.rex-hub .home-ways, .rex-hub .home-apps, .rex-hub .home-labels { margin: 4px 0; padding-left: 20px; }
.rex-hub .home-ways li, .rex-hub .home-apps li, .rex-hub .home-labels li { margin: 4px 0; }
.embed .rex-hub .home { display: none; }
@media (max-width: 600px) { .rex-hub .brand-logo .logo { height: 38px; }
.rex-hub .home h2 { font-size: 23px; }
.rex-hub .home-stats li { min-width: 7rem; } }
.rex-hub .tools select { max-width: 17rem; padding: 6px 8px; font: inherit; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); }
.rex-hub .role-status { flex: 1 1 100%; color: #fff; font-size: 13px; opacity: 0.9; }
.rex-hub .role-status:empty { display: none; }
.rex-hub .role-filtered #role-filter { outline: 2px solid #f2b705; }
.rex-hub .overview { display: grid; gap: 14px; max-width: 60rem; }
.rex-hub .ov-summary { margin: 0; color: var(--muted); }
.rex-hub .ov-card { padding: 12px 16px; background: var(--card); border: 1px solid var(--line); border-radius: 6px; }
.rex-hub .ov-card h3 { margin: 0 0 4px; }
.rex-hub .ov-card h4 { margin: 10px 0 4px; font-size: 14px; color: var(--muted); }
.rex-hub .ov-intro { margin: 0 0 8px; color: var(--muted); font-size: 14px; }
.rex-hub .ov-empty { margin: 6px 0; color: var(--muted); }
.rex-hub .ov-files, .rex-hub .ov-docs { list-style: none; margin: 4px 0; padding: 0; }
.rex-hub .ov-files li { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; padding: 3px 0; }
.rex-hub .ov-files .meta, .rex-hub .ov-docs .meta { color: var(--muted); font-size: 13px; }
.rex-hub .ov-doc { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-top: 1px solid var(--line); }
.rex-hub .ov-doc:first-child { border-top: 0; }
.rex-hub .ov-doc a { font-weight: 600; }
.rex-hub .ov-desc { color: var(--muted); font-size: 14px; }
.rex-hub .ov-by-process, .rex-hub .ov-diagrams { margin: 8px 0; }
.rex-hub .ov-by-process summary, .rex-hub .ov-diagrams summary { cursor: pointer; font-weight: 600; }
.rex-hub .ov-proc { margin: 8px 0 8px 14px; }
.rex-hub .ov-proc-head a { font-weight: 600; }
.rex-hub .ov-more { margin: 10px 0 2px; }
@media (max-width: 600px) { .rex-hub .ov-doc { flex-direction: column; gap: 2px; } }
.rex-hub .map.map-zoomable { position: relative; overflow: auto; max-height: 70vh; }
.rex-hub .map.map-zoomable.zoomed { cursor: grab; }
.rex-hub .map.map-zoomable.panning { cursor: grabbing; user-select: none; }
.rex-hub .map-controls { position: sticky; top: 0; left: 0; z-index: 2; display: flex; gap: 6px; align-items: center; justify-content: flex-end; padding: 4px; background: rgba(255, 255, 255, 0.92); }
.rex-hub .map-btn { min-width: 34px; padding: 3px 10px; font: inherit; cursor: pointer; background: #fff; border: 1px solid var(--line); border-radius: 6px; }
.rex-hub .map-btn:hover { background: var(--navy-soft); }
.rex-hub .map-level { min-width: 3.2em; text-align: center; color: var(--muted); font-size: 13px; }
.rex-hub .map.map-full { max-height: none; height: 100vh; padding: 12px; background: #fff; }
.rex-hub .map.map-full .map-controls { padding: 8px; }
@media print { .rex-hub .map-controls { display: none; }
.rex-hub .map.map-zoomable { max-height: none; overflow: visible; } }
.rex-hub .step-training { margin-left: auto; font-size: .8rem; padding: 0 8px; border: 1px solid var(--navy); border-radius: 10px; text-decoration: none; white-space: nowrap; }
.rex-hub .proc-training { margin-top: 1rem; }
.rex-hub #theme-toggle { white-space: nowrap; }
.rex-hub :is(#tree, #role-tree, #training-tree) { padding: 8px; background: var(--card); }
.rex-hub :is(#tree, #role-tree, #training-tree) :is(.app, .group) { margin: 0; }
.rex-hub :is(#tree, #role-tree, #training-tree) :is(.app, .group, .module, .module-row, .area) > .node { display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 10px; border: 0; border-radius: 6px; background: none; color: var(--ink); font: inherit; font-size: 14px; font-weight: 400; text-align: left; cursor: pointer; }
.rex-hub :is(#tree, #role-tree, #training-tree) :is(.app, .group) > .node { font-weight: 600; font-size: 15px; }
.rex-hub :is(#tree, #role-tree, #training-tree) .node > .name { order: 1; flex: 1; min-width: 0; }
.rex-hub :is(#tree, #role-tree, #training-tree) .node > .meta { order: 2; margin-left: auto; color: var(--muted); font-size: 12px; font-weight: 400; white-space: nowrap; }
.rex-hub :is(#tree, #role-tree, #training-tree) .node > span[aria-hidden="true"] { order: 3; color: var(--muted); }
.rex-hub :is(#tree, #role-tree, #training-tree) :is(.app, .group, .module, .module-row, .area) > .node:is(:hover, :focus-visible) { background: var(--navy-soft); }
.rex-hub :is(#tree, #role-tree, #training-tree) :is(.app, .group) > :is(.module, .group, .module-row, .supportbox) { margin: 0 0 0 14px; padding-left: 8px; border-left: 1px solid var(--line); }
.rex-hub :is(#tree, #role-tree, #training-tree) .module > :is(.area, .processes, .module-overview) { margin-left: 10px; padding-left: 8px; border-left: 1px solid var(--line); }
.rex-hub :is(#tree, #role-tree, #training-tree) .area > .processes { margin-left: 10px; padding-left: 8px; border-left: 1px solid var(--line); }
.rex-hub :is(#tree, #role-tree, #training-tree) .process { border-radius: 6px; }
.rex-hub :is(#tree, #role-tree, #training-tree) .process:is(:hover, :focus-visible) { background: var(--navy-soft); }
.rex-hub :is(#tree, #role-tree, #training-tree) .process[aria-current="true"] { background: var(--navy-soft); color: var(--ink); box-shadow: inset 3px 0 0 var(--accent, #0b3a5b); font-weight: 700; }
.rex-hub .hub-nav-btn { border-radius: 6px; }
.rex-hub .hub-nav-btn.is-current { background: var(--navy-soft); color: var(--ink); box-shadow: inset 3px 0 0 var(--accent, #0b3a5b); font-weight: 700; }
.rex-hub .hub-nav-btn .hub-count { background: none; padding: 0; color: var(--muted); font-size: 12px; font-weight: 400; }
.rex-hub .hub-nav-btn.is-current .hub-count { background: none; color: var(--ink); }
.rex-hub .tile-grid, .rex-hub .hub-cards { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.rex-hub .tile, .rex-hub .hub-card { display: flex; flex-direction: column; gap: 4px; min-height: 0; padding: 14px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; color: var(--ink); text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.rex-hub a.tile:is(:hover, :focus-visible), .rex-hub a.hub-card:is(:hover, :focus-visible) { background: var(--card); border-color: var(--line); transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0, 0, 0, .12); }
.rex-hub .tile.in-scope { border-left: 1px solid var(--line); box-shadow: inset 3px 0 0 var(--green); }
.rex-hub a.tile.in-scope:is(:hover, :focus-visible) { box-shadow: inset 3px 0 0 var(--green), 0 8px 18px rgba(0, 0, 0, .12); }
.rex-hub .tile.planned { border-left: 1px solid var(--line); color: var(--muted); }
.rex-hub .tile-id, .rex-hub .hub-card-id { align-self: flex-start; font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 10px; background: var(--navy-soft); color: var(--ink); }
.rex-hub .tile-name, .rex-hub .hub-card-name { font-size: 15px; font-weight: 600; }
.rex-hub .tile-meta, .rex-hub .hub-card-meta { margin-top: auto; font-size: 12px; color: var(--muted); }
.rex-hub .tile-id:empty, .rex-hub .hub-card-id:empty { display: none; }
.rex-hub .also-in { margin: 12px 0 16px; padding: 10px 14px; border: 1px solid var(--line, #d5dbe3); border-left: 4px solid var(--accent, #0b3a5b); border-radius: 6px; background: var(--card, #fff); color: var(--ink, #1c2430); }
.rex-hub .also-in h3 { margin: 0 0 4px; font-size: 14px; }
.rex-hub .also-in-note { margin: 0 0 8px; color: var(--muted, #5c6770); font-size: 13px; }
.rex-hub .also-in-list { margin: 0; padding-left: 18px; font-size: 13px; }
.rex-hub .also-in-list li { margin: 3px 0; }
.rex-hub .also-in-guide { color: var(--muted, #5c6770); margin: 0 6px; }
.rex-hub .cap-pill { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 9px; border-radius: 10px; background: var(--navy-soft, #e7eef5); color: var(--muted, #5c6770); white-space: nowrap; }
.rex-hub .cap-pill.reviewed { background: var(--green-bg, #e7f4ec); color: var(--green, #1f6b45); }
.rex-hub .cap-pill.l4-draft { background: var(--amber-bg, #f8efe6); color: var(--amber, #7a3412); }
.rex-hub .variant-toggle { border: 0; background: none; color: var(--accent, #0b3a5b); cursor: pointer; font: inherit; font-size: 12px; padding: 0 0 0 8px; text-decoration: underline; }
.rex-hub tr.variant-row td { background: var(--navy-soft, #e7eef5); font-size: 12px; }
.rex-hub tr.variant-row td:first-child { padding-left: 24px; }
.rex-hub .variant-group { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--ink, #1c2430); cursor: pointer; }
.rex-hub .cap-layout { display: grid; grid-template-columns: var(--cap-w, 280px) 8px minmax(0, 1fr); min-height: 60vh; }
.rex-hub #cap-split { cursor: col-resize; background: var(--line); touch-action: none; }
.rex-hub #cap-split:hover, .rex-hub #cap-split.dragging, .rex-hub #cap-split:focus-visible { background: var(--navy); outline: none; }
.rex-hub #cap-side { border-right: 1px solid var(--line); background: var(--card); overflow-y: auto; max-height: calc(100vh - 140px); position: sticky; top: 0; }
.rex-hub .cap-side-head { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.rex-hub .cap-badge { background: var(--navy-soft); color: var(--ink); border-radius: 10px; padding: 1px 8px; font-size: 12px; text-transform: none; letter-spacing: 0; }
.rex-hub #cap-nav { padding: 8px; }
.rex-hub .cap-side-tools { display: flex; gap: 6px; padding: 8px 8px 0; }
.rex-hub .cap-side-tools button { flex: 1; cursor: pointer; font-size: 12px; }
.rex-hub #cap-nav button { display: flex; width: 100%; justify-content: space-between; gap: 8px; align-items: center; text-align: left; border: 0; background: none; color: var(--ink); padding: 7px 10px; border-radius: 6px; cursor: pointer; font: inherit; }
.rex-hub #cap-nav button:hover { background: var(--navy-soft); }
.rex-hub #cap-nav button[aria-current="true"] { background: var(--navy-soft); font-weight: 700; box-shadow: inset 3px 0 0 var(--accent, #0b3a5b); }
.rex-hub #cap-nav .cap-group > button { font-weight: 600; }
.rex-hub #cap-nav .cap-group > button::after { content: "\25B8"; color: var(--muted); }
.rex-hub #cap-nav .cap-group > button[aria-expanded="true"]::after { content: "\25BE"; }
.rex-hub #cap-nav .cap-mods { margin: 0 0 4px 14px; padding: 0 0 0 8px; list-style: none; border-left: 1px solid var(--line); }
.rex-hub #cap-nav .cap-mods button { font-size: 13px; padding: 5px 8px; }
.rex-hub #cap-nav .count { color: var(--muted); font-size: 12px; }
.rex-hub #cap-main { padding: 20px 24px; min-width: 0; }
.rex-hub .cap-crumb { font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.rex-hub .cap-title { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 6px; }
.rex-hub .cap-about { color: var(--muted); margin: 0 0 16px; }
.rex-hub .cap-bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 16px; }
.rex-hub .cap-pills { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.rex-hub .cap-pills button { border: 0; background: var(--card); color: var(--ink); padding: 5px 12px; cursor: pointer; font: inherit; font-size: 13px; }
.rex-hub .cap-pills button[aria-pressed="true"] { background: var(--navy-soft); font-weight: 700; }
.rex-hub .cap-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; margin: 0 0 24px; }
.rex-hub .cap-card { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 14px; text-align: left; color: var(--ink); font: inherit; cursor: pointer; text-decoration: none; display: block; transition: transform .15s ease, box-shadow .15s ease; }
.rex-hub .cap-card:hover, .rex-hub .cap-card:focus-visible { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0, 0, 0, .12); }
.rex-hub .cap-card h3 { margin: 4px 0 6px; font-size: 15px; }
.rex-hub .cap-card p { margin: 0 0 8px; color: var(--muted); font-size: 13px; }
.rex-hub .cap-card .meta { font-size: 12px; color: var(--muted); }
.rex-hub .cap-chip { display: inline-block; font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 10px; background: var(--navy-soft); color: var(--ink); margin-right: 4px; }
.rex-hub .cap-chip.reviewed { background: var(--green-bg); color: var(--green); }
.rex-hub .cap-chip.l4-draft { background: var(--amber-bg); color: var(--amber); }
.rex-hub { --meter-draft: #e0a030; }
.rex-hub .cap-pill { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 9px; border-radius: 10px; background: var(--navy-soft); color: var(--muted); white-space: nowrap; }
.rex-hub .cap-pill.reviewed { background: var(--green-bg); color: var(--green); }
.rex-hub .cap-pill.l4-draft { background: var(--amber-bg); color: var(--amber); }
.rex-hub .cap-pill.skeleton, .rex-hub .cap-pill.ref { background: var(--navy-soft); color: var(--muted); }
.rex-hub .cap-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 7px; background: var(--line); }
.rex-hub .cap-dot.reviewed { background: var(--green); }
.rex-hub .cap-dot.l4-draft { background: var(--meter-draft); }
.rex-hub .cap-meter { display: flex; height: 6px; border-radius: 3px; overflow: hidden; background: var(--line); margin: 8px 0; }
.rex-hub .cap-meter .reviewed { background: var(--green); }
.rex-hub .cap-meter .l4-draft { background: var(--meter-draft); }
.rex-hub .cap-progress { font-size: 13px; font-weight: 400; color: var(--muted); }
.rex-hub .cap-register { background: var(--card); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.rex-hub .cap-register header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); background: none; color: var(--ink); }
.rex-hub .cap-register h2 { margin: 0; font-size: 16px; }
.rex-hub .cap-table-wrap { overflow-x: auto; }
.rex-hub .cap-register table { border-collapse: collapse; width: 100%; font-size: 13px; }
.rex-hub .cap-register th, .rex-hub .cap-register td { text-align: left; padding: 7px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.rex-hub .cap-register th { cursor: pointer; white-space: nowrap; color: var(--muted); font-weight: 600; }
.rex-hub .cap-register td a { color: var(--accent, #0b3a5b); }
.rex-hub .cap-more { margin: 12px 14px; }
.rex-hub .cap-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 0 0 22px; }
.rex-hub .cap-stat { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.rex-hub .cap-stat strong { font-size: 24px; line-height: 1.1; color: var(--ink); }
.rex-hub .cap-stat span { font-size: 12px; color: var(--muted); }
.rex-hub .cap-section { margin: 0 0 8px; }
.rex-hub .cap-section > h2, .rex-hub #cap-main > h2 { font-size: 16px; margin: 6px 0 10px; }
.rex-hub .cap-hint { margin-left: 10px; font-size: 12px; font-weight: 400; color: var(--muted); }
.rex-hub #cap-main .cap-register { margin: 0 0 16px; }
.rex-hub .cap-register .variant-group { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--ink); }
.rex-hub .cap-register input[type="search"] { max-width: 220px; }
.rex-hub .cap-bar .variant-group { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--ink); }
.rex-hub .training-module { padding: 8px 14px; }
.rex-hub .cap-register ul.processes { margin: 0; padding: 4px 14px 10px; list-style: none; }
.rex-hub .role-body { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 6px 16px 14px; }
@media (max-width: 800px) { .rex-hub .cap-layout { grid-template-columns: 1fr; }
.rex-hub #cap-split { display: none; }
.rex-hub #cap-side { position: static; max-height: 280px; border-right: 0; border-bottom: 1px solid var(--line); } }
.rex-hub .cap-side-head .cap-badge { white-space: nowrap; }

.rex-hub.alignfull { box-sizing: border-box; }
.rex-hub.rex-hub--breakout { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding-left: 16px; padding-right: 16px; }
body:has(.rex-hub--breakout) { overflow-x: clip; }