/*
 * ALPLINE 4.0.55 — Master Visual System
 * Human-readable additive presentation layer.
 *
 * Goals:
 * - Preserve existing routes, forms, permissions and business logic.
 * - Apply one paper-clean enterprise visual language across public, member,
 *   franchise and administration workspaces.
 * - Keep content screen-fit and prevent text/card overlap.
 * - Keep genealogy intentionally simple: one visual level, centred sponsor,
 *   fixed-size member cards and full-width horizontal scrolling.
 */

:root {
    --alp455-ink: #0d241d;
    --alp455-muted: #62746d;
    --alp455-line: #e2ebe6;
    --alp455-paper: #ffffff;
    --alp455-canvas: #f7faf8;
    --alp455-emerald: #075342;
    --alp455-emerald-deep: #043c31;
    --alp455-gold: #d8a82f;
    --alp455-blue: #1c7fe8;
    --alp455-red: #e84e71;
    --alp455-violet: #8a43e8;
    --alp455-radius: 12px;
    --alp455-shadow: 0 10px 26px rgba(17, 54, 43, 0.055);
    --alp455-content-max: 1280px;
    --alp455-sidebar: 228px;
}

/* --------------------------------------------------------------------------
   Global safety and typography
   -------------------------------------------------------------------------- */
body.release-455,
body.release-455 button,
body.release-455 input,
body.release-455 select,
body.release-455 textarea {
    font-family: Inter, "Segoe UI", Arial, sans-serif !important;
}

body.release-455 {
    color: var(--alp455-ink);
    background: var(--alp455-canvas);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.release-455 *,
body.release-455 *::before,
body.release-455 *::after {
    box-sizing: border-box;
}

body.release-455 img {
    max-width: 100%;
}

body.release-455 :is(h1, h2, h3, h4, p) {
    overflow-wrap: anywhere;
}

body.release-455 :is(input, select, textarea, button) {
    min-width: 0;
}

body.release-455 .table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

body.release-455 table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

body.release-455 th {
    white-space: nowrap;
    font-size: 10px;
    letter-spacing: .045em;
}

body.release-455 td {
    vertical-align: middle;
}

/* --------------------------------------------------------------------------
   Shared portal shell — same structure for Admin, Member and Franchise
   -------------------------------------------------------------------------- */
body.release-455.portal-body {
    min-height: 100vh;
    background: var(--alp455-canvas) !important;
}

body.release-455 .portal-shell {
    display: grid !important;
    grid-template-columns: var(--alp455-sidebar) minmax(0, 1fr) !important;
    min-height: 100vh;
}

body.release-455 .portal-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    overflow-x: hidden;
    background:
        linear-gradient(180deg, rgba(3, 59, 47, .98), rgba(2, 48, 39, .99)) !important;
    border-right: 1px solid rgba(255, 255, 255, .08);
    box-shadow: none !important;
    scrollbar-width: thin;
}

body.release-455 .portal-brand {
    min-height: 70px;
    padding: 12px 16px !important;
    border-bottom: 1px solid rgba(255,255,255,.09);
}

body.release-455 .portal-brand img {
    width: 38px !important;
    height: 38px !important;
    object-fit: contain;
}

body.release-455 .portal-brand b {
    font-size: 18px !important;
    letter-spacing: .045em;
}

body.release-455 .portal-brand small {
    font-size: 8.5px !important;
    letter-spacing: .11em;
    opacity: .8;
}

body.release-455 .live-data-badge {
    margin: 8px 12px 4px !important;
    padding: 7px 9px !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: 9px !important;
    background: rgba(255,255,255,.045) !important;
    font-size: 9px !important;
}

body.release-455 .portal-nav-label {
    margin: 13px 15px 5px !important;
    font-size: 8.5px !important;
    letter-spacing: .15em;
    color: rgba(255,255,255,.55) !important;
}

body.release-455 .portal-nav {
    padding: 0 9px;
}

body.release-455 .portal-nav > a,
body.release-455 .portal-nav-group > summary,
body.release-455 .admin-member-preview-menu button {
    min-height: 38px !important;
    margin: 2px 0 !important;
    padding: 8px 10px !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    font-size: 11.5px !important;
    font-weight: 650 !important;
    color: rgba(255,255,255,.9) !important;
    background: transparent !important;
}

body.release-455 .portal-nav > a i,
body.release-455 .portal-nav-group > summary i,
body.release-455 .admin-member-preview-menu i {
    width: 22px !important;
    min-width: 22px !important;
    font-size: 14px !important;
    text-align: center;
    color: #f2d16f !important;
}

body.release-455 .portal-nav > a:hover,
body.release-455 .portal-nav-group > summary:hover,
body.release-455 .admin-member-preview-menu button:hover {
    background: rgba(255,255,255,.06) !important;
}

body.release-455 .portal-nav > a.active,
body.release-455 .portal-nav-group a.active {
    color: #102018 !important;
    background: linear-gradient(135deg, #f7dc7c, #d8a82f) !important;
    border-color: #f1d269 !important;
    box-shadow: 0 5px 12px rgba(0,0,0,.12) !important;
}

body.release-455 .portal-nav > a.active i {
    color: #143128 !important;
}

body.release-455 .portal-nav-group > a {
    margin: 1px 0 1px 31px !important;
    padding: 7px 10px !important;
    border-radius: 8px !important;
    color: rgba(255,255,255,.72) !important;
    font-size: 10.5px !important;
}

body.release-455 .portal-public-link {
    margin: 12px !important;
    border-radius: 9px !important;
    font-size: 10px !important;
}

body.release-455 .portal-stage {
    min-width: 0;
    width: 100%;
    background: var(--alp455-canvas) !important;
}

body.release-455 .portal-topbar {
    position: sticky;
    top: 0;
    z-index: 70;
    min-height: 58px !important;
    padding: 7px 16px !important;
    gap: 10px !important;
    background: rgba(255,255,255,.97) !important;
    border-bottom: 1px solid var(--alp455-line) !important;
    box-shadow: 0 3px 12px rgba(21,55,43,.035) !important;
    backdrop-filter: blur(10px);
}

body.release-455 .topbar-identity small {
    font-size: 8.5px !important;
    letter-spacing: .08em;
}

body.release-455 .topbar-identity b {
    font-size: 12.5px !important;
}

body.release-455 .topbar-identity span {
    font-size: 10px !important;
}

body.release-455 .portal-top-actions {
    gap: 5px !important;
}

body.release-455 .portal-top-actions > a,
body.release-455 .portal-top-actions summary {
    padding: 7px 9px !important;
    border-radius: 8px !important;
    font-size: 10px !important;
}

body.release-455 .portal-content {
    width: 100%;
    padding: 14px 16px 28px !important;
    background: var(--alp455-canvas) !important;
}

body.release-455 .portal-content > main,
body.release-455 .portal-content > .dashboard,
body.release-455 .portal-content > .network-page,
body.release-455 .portal-content > .profile-centre,
body.release-455 .portal-content > .login-shell {
    width: min(100%, var(--alp455-content-max));
    margin-inline: auto !important;
}

/* --------------------------------------------------------------------------
   Shared paper-clean cards, forms and page headings
   -------------------------------------------------------------------------- */
body.release-455 .dash-head,
body.release-455 .network-head,
body.release-455 .control-card,
body.release-455 .workspace-card,
body.release-455 .team-section,
body.release-455 .invite-card,
body.release-455 .activation-strip,
body.release-455 .profile-intro,
body.release-455 .profile-form,
body.release-455 .game-stage,
body.release-455 .login-card,
body.release-455 .customer-panel {
    border: 1px solid var(--alp455-line) !important;
    background: var(--alp455-paper) !important;
    border-radius: var(--alp455-radius) !important;
    box-shadow: var(--alp455-shadow) !important;
}

body.release-455 .dash-head,
body.release-455 .network-head {
    padding: 16px 18px !important;
    margin-bottom: 12px !important;
}

body.release-455 .dash-head h1,
body.release-455 .network-head h1,
body.release-455 .profile-intro h1 {
    margin: 3px 0 5px !important;
    font-size: clamp(22px, 2vw, 30px) !important;
    line-height: 1.06 !important;
    letter-spacing: -.025em;
}

body.release-455 .dash-head p,
body.release-455 .network-head p,
body.release-455 .profile-intro p {
    max-width: 760px;
    margin: 4px 0 !important;
    color: var(--alp455-muted) !important;
    font-size: 11.5px !important;
    line-height: 1.5 !important;
}

body.release-455 .eyebrow {
    font-size: 8.5px !important;
    letter-spacing: .13em !important;
    font-weight: 800 !important;
}

body.release-455 .identity {
    min-width: 180px !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    background: #f7faf8 !important;
    border: 1px solid var(--alp455-line) !important;
}

body.release-455 .identity b {
    font-size: 18px !important;
}

body.release-455 .control-card {
    margin: 11px 0 !important;
    padding: 14px !important;
}

body.release-455 .control-card > summary {
    min-height: 34px;
    font-size: 11.5px !important;
    font-weight: 800 !important;
}

body.release-455 .control-card h2,
body.release-455 .section-title h2,
body.release-455 .team-section h2 {
    font-size: 17px !important;
    line-height: 1.15 !important;
}

body.release-455 .notice {
    margin: 8px 0 !important;
    padding: 9px 11px !important;
    border-radius: 8px !important;
    font-size: 10.5px !important;
    line-height: 1.45 !important;
}

body.release-455 .form-grid,
body.release-455 .journal-form {
    gap: 10px !important;
}

body.release-455 label {
    font-size: 10.5px !important;
    font-weight: 700;
}

body.release-455 :is(input, select, textarea) {
    min-height: 38px;
    padding: 8px 10px !important;
    border: 1px solid #dbe6e0 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--alp455-ink) !important;
    font-size: 11px !important;
    box-shadow: none !important;
}

body.release-455 textarea {
    min-height: 88px;
}

body.release-455 .btn,
body.release-455 button.btn {
    min-height: 36px;
    padding: 8px 13px !important;
    border-radius: 8px !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: .015em;
}

/* --------------------------------------------------------------------------
   Member dashboard and common inner pages
   -------------------------------------------------------------------------- */
body.release-455.member-portal .dashboard {
    display: block;
}

body.release-455 .workspace-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 0 0 10px !important;
}

body.release-455 .workspace-card {
    min-height: 150px !important;
    padding: 14px !important;
}

body.release-455 .workspace-card > span:first-child {
    width: 28px !important;
    height: 28px !important;
    border-radius: 8px !important;
    font-size: 10px !important;
}

body.release-455 .workspace-card h3 {
    margin: 8px 0 5px !important;
    font-size: 22px !important;
}

body.release-455 .workspace-card p,
body.release-455 .workspace-card :is(dt,dd,a) {
    font-size: 10.5px !important;
}

body.release-455 .live-summary,
body.release-455 .network-metrics,
body.release-455 .franchise-kpis {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 9px !important;
    margin: 10px 0 !important;
}

body.release-455 .live-summary > article,
body.release-455 .network-metrics > article,
body.release-455 .franchise-kpis > article {
    min-width: 0;
    padding: 11px 12px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.release-455 .live-summary > article b,
body.release-455 .network-metrics > article b,
body.release-455 .franchise-kpis > article b {
    font-size: 19px !important;
    line-height: 1.1;
}

body.release-455 .function-launchpad,
body.release-455 .team-snapshot,
body.release-455 .reward-section,
body.release-455 .catalog-mini,
body.release-455 .admin-radar {
    margin: 11px 0 !important;
    padding: 14px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: var(--alp455-shadow) !important;
}

body.release-455 .function-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 9px !important;
}

body.release-455 .function-grid > a {
    min-height: 74px !important;
    padding: 10px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg,#ffffff,#f7faf8) !important;
    box-shadow: none !important;
}

body.release-455 .function-grid > a i {
    width: 31px !important;
    height: 31px !important;
    border-radius: 9px !important;
}

body.release-455 .function-grid > a b {
    font-size: 11.5px !important;
}

body.release-455 .function-grid > a small {
    font-size: 9.5px !important;
    line-height: 1.35;
}

body.release-455 .mini-products {
    gap: 9px !important;
}

body.release-455 .mini-products article {
    min-width: 0 !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
}

/* Inner member pages use the same paper language even when old markup differs. */
body.release-455.member-portal .portal-content :is(
    .order-card,
    .wallet-card,
    .level-card,
    .team-card,
    .income-card,
    .shop-products > article,
    .product-card,
    .kyc-card,
    .feedback-card,
    .conversation-thread,
    .business-card,
    .direct-team-shell
) {
    border-color: var(--alp455-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

body.release-455 .shop-products {
    gap: 10px !important;
}

body.release-455 .shop-products > article {
    background: #fff !important;
    padding: 11px !important;
}

body.release-455 .shop-products .product-image {
    min-height: 140px !important;
    max-height: 160px;
    border-radius: 9px !important;
    background: #fbfcfb !important;
}

body.release-455 .shop-products .product-image img {
    width: 100%;
    height: 150px;
    object-fit: contain;
}

/* --------------------------------------------------------------------------
   Administration dashboard — compact enterprise cards, no horizontal sprawl
   -------------------------------------------------------------------------- */
body.release-455.admin-portal .admin-console {
    width: min(100%, var(--alp455-content-max));
    margin-inline: auto;
}

body.release-455 .ap419-admin-hero {
    margin: 0 0 10px !important;
    padding: 14px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: var(--alp455-ink) !important;
    box-shadow: var(--alp455-shadow) !important;
}

body.release-455 .ap419-hero-top {
    gap: 10px !important;
}

body.release-455 .ap419-hero-copy h1 {
    margin: 2px 0 !important;
    color: var(--alp455-ink) !important;
    font-size: 24px !important;
}

body.release-455 .ap419-hero-copy p,
body.release-455 .ap419-owner-panel span {
    color: var(--alp455-muted) !important;
    font-size: 10.5px !important;
}

body.release-455 .ap419-hero-actions {
    gap: 6px !important;
}

body.release-455 .ap419-hero-actions a {
    padding: 7px 9px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 8px !important;
    background: #f8faf9 !important;
    color: var(--alp455-emerald) !important;
    font-size: 9.5px !important;
}

body.release-455 .ap419-owner-panel {
    padding: 10px 12px !important;
    border: 1px solid #eadbad !important;
    border-radius: 10px !important;
    background: #fffdf7 !important;
    color: var(--alp455-ink) !important;
}

body.release-455 .ap419-kpi-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 11px !important;
}

body.release-455 .ap419-kpi {
    min-height: 86px !important;
    padding: 11px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: var(--alp455-ink) !important;
    box-shadow: none !important;
}

body.release-455 .ap419-kpi:nth-child(4n+1) { border-top: 3px solid #18a96b !important; }
body.release-455 .ap419-kpi:nth-child(4n+2) { border-top: 3px solid #1c7fe8 !important; }
body.release-455 .ap419-kpi:nth-child(4n+3) { border-top: 3px solid #e0aa2e !important; }
body.release-455 .ap419-kpi:nth-child(4n+4) { border-top: 3px solid #8a43e8 !important; }

body.release-455 .ap419-kpi small,
body.release-455 .ap419-kpi span {
    color: var(--alp455-muted) !important;
}

body.release-455 .ap419-kpi b {
    color: var(--alp455-ink) !important;
    font-size: 22px !important;
}

body.release-455 .admin-live-visuals,
body.release-455 .ap420-system-strip,
body.release-455 .admin-quick-launch {
    margin: 10px 0 !important;
    border-color: var(--alp455-line) !important;
    box-shadow: none !important;
}

body.release-455 .admin-live-visuals__grid,
body.release-455 .admin-quick-launch {
    gap: 8px !important;
}

body.release-455 .admin-live-signal,
body.release-455 .admin-quick-launch > a,
body.release-455 .ap420-system-strip > a {
    border: 1px solid var(--alp455-line) !important;
    border-radius: 9px !important;
    background: #fff !important;
    box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Franchise — same visual system, business logic untouched
   -------------------------------------------------------------------------- */
body.release-455.franchise-portal .dashboard,
body.release-455.admin-portal .dashboard {
    width: min(100%, var(--alp455-content-max));
    margin-inline: auto;
}

body.release-455 .franchise-command-strip {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
    gap: 8px !important;
    margin: 10px 0 !important;
}

body.release-455 .franchise-command-strip > a {
    min-width: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.release-455 .franchise-command-strip > a b {
    font-size: 10.5px !important;
}

body.release-455 .franchise-command-strip > a small {
    font-size: 9px !important;
}

/* --------------------------------------------------------------------------
   Genealogy — approved one-level, centred, scrollable paper-clean visual
   -------------------------------------------------------------------------- */
body.release-455 .network-page {
    width: min(100%, var(--alp455-content-max));
    margin-inline: auto;
}

body.release-455 .network-head {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 14px !important;
}

body.release-455 .network-head h1 {
    font-size: 24px !important;
}

body.release-455 .network-head h1 br {
    display: none;
}

body.release-455 .network-head h1 em {
    font-style: normal;
}

body.release-455 .network-identity,
body.release-455 .network-root-search {
    max-width: 360px;
}

body.release-455 .genealogy-command {
    margin: 10px 0 12px !important;
    padding: 12px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: var(--alp455-ink) !important;
    box-shadow: var(--alp455-shadow) !important;
}

body.release-455 .genealogy-command__head {
    display: grid !important;
    grid-template-columns: 1fr minmax(250px, 390px) !important;
    align-items: end !important;
    gap: 12px !important;
    padding: 0 0 10px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--alp455-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

body.release-455 .genealogy-command__head h2 {
    margin: 2px 0 4px !important;
    color: var(--alp455-ink) !important;
    font-size: 17px !important;
}

body.release-455 .genealogy-command__head p,
body.release-455 .genealogy-command__head label {
    margin: 0 !important;
    color: var(--alp455-muted) !important;
    font-size: 10px !important;
}

body.release-455 .genealogy-command__search {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

body.release-455 .genealogy-command__search span {
    display: flex;
    gap: 6px;
}

body.release-455 .genealogy-command__search button {
    min-width: 72px;
    border: 0;
    border-radius: 8px;
    background: var(--alp455-emerald);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
}

body.release-455 .genealogy-command__nav {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px !important;
    margin: 9px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

body.release-455 .genealogy-command__nav a,
body.release-455 .genealogy-command__nav span {
    padding: 6px 8px !important;
    border: 1px solid var(--alp455-line) !important;
    border-radius: 7px !important;
    background: #fbfcfb !important;
    color: var(--alp455-muted) !important;
    font-size: 9px !important;
    font-weight: 750;
}

body.release-455 .genealogy-one-level {
    position: relative;
    padding: 18px 0 4px;
}

body.release-455 .genealogy-sponsor {
    width: 102px;
    margin: 0 auto;
    text-align: center;
}

body.release-455 .genealogy-person-photo,
body.release-455 .genealogy-person-initials {
    display: grid;
    width: 58px;
    height: 58px;
    margin: 0 auto 5px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 9px;
    background: linear-gradient(145deg,#edf7f2,#f8fbf9);
    color: var(--alp455-emerald);
    font-size: 20px;
    font-weight: 900;
}

body.release-455 .genealogy-person-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.release-455 .genealogy-sponsor strong,
body.release-455 .genealogy-direct-card strong {
    display: block;
    width: 100%;
    overflow: hidden;
    color: var(--alp455-ink);
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.release-455 .genealogy-sponsor b,
body.release-455 .genealogy-direct-card b {
    display: block;
    margin-top: 2px;
    color: #70817a;
    font-size: 9px;
    font-weight: 650;
    line-height: 1.2;
    text-align: center;
}

body.release-455 .genealogy-sponsor .status,
body.release-455 .genealogy-direct-card .status {
    display: inline-flex;
    margin-top: 5px;
    padding: 3px 7px !important;
    border-radius: 999px !important;
    font-size: 8px !important;
}

body.release-455 .genealogy-sponsor-line {
    position: relative;
    width: 1px;
    height: 34px;
    margin: 6px auto 0;
    background: #baccc4;
}

body.release-455 .genealogy-direct-shell {
    position: relative;
    width: 100%;
    min-height: 202px;
    padding: 18px 42px 26px;
    overflow: hidden;
    border: 1px solid #e4ece8;
    border-radius: 10px;
    background: #fff;
}

body.release-455 .genealogy-direct-shell::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 18px;
    background: #baccc4;
}

body.release-455 .genealogy-direct-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 2px 11px;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: #cbd8d2 #f3f6f4;
}

body.release-455 .genealogy-direct-scroll::-webkit-scrollbar {
    height: 7px;
}

body.release-455 .genealogy-direct-scroll::-webkit-scrollbar-track {
    border-radius: 999px;
    background: #f3f6f4;
}

body.release-455 .genealogy-direct-scroll::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #cbd8d2;
}

body.release-455 .genealogy-direct-track {
    display: flex;
    width: max-content;
    min-width: 100%;
    min-height: 145px;
    align-items: flex-start;
    justify-content: center;
    gap: clamp(26px, 4vw, 58px);
    padding: 18px clamp(18px, 5vw, 66px) 4px;
}

body.release-455 .genealogy-direct-track.is-overflowing {
    justify-content: flex-start;
    gap: 18px;
}

body.release-455 .genealogy-direct-card {
    position: relative;
    flex: 0 0 86px;
    width: 86px;
    min-width: 86px;
    padding-top: 10px;
    text-decoration: none;
}

body.release-455 .genealogy-direct-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 9px;
    background: #c3d2cb;
}

body.release-455 .genealogy-direct-card .genealogy-person-photo,
body.release-455 .genealogy-direct-card .genealogy-person-initials {
    width: 54px;
    height: 54px;
    margin-bottom: 5px;
    font-size: 17px;
}

body.release-455 .genealogy-leg {
    display: inline-flex;
    margin-top: 4px;
    padding: 2px 6px;
    border-radius: 999px;
    background: #eef7f2;
    color: var(--alp455-emerald);
    font-size: 7.5px;
    font-weight: 850;
    letter-spacing: .06em;
}

body.release-455 .genealogy-leg.is-b {
    background: #fff7e7;
    color: #936c0b;
}

body.release-455 .genealogy-direct-empty {
    width: 100%;
    padding: 45px 10px;
    text-align: center;
    color: var(--alp455-muted);
    font-size: 11px;
}

body.release-455 .genealogy-scroll-arrow {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    transform: translateY(-35%);
    border: 1px solid #dde7e2;
    border-radius: 50%;
    background: rgba(255,255,255,.96);
    color: #4d655a;
    cursor: pointer;
    box-shadow: 0 3px 9px rgba(18,55,43,.05);
}

body.release-455 .genealogy-scroll-arrow.left { left: 8px; }
body.release-455 .genealogy-scroll-arrow.right { right: 8px; }
body.release-455 .genealogy-scroll-arrow[hidden] { display: none !important; }

body.release-455 .genealogy-summary-line {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 7px;
    color: var(--alp455-muted);
    font-size: 9px;
}

body.release-455 .genealogy-summary-line span {
    padding: 4px 7px;
    border: 1px solid var(--alp455-line);
    border-radius: 999px;
    background: #fbfcfb;
}

/* Old heavy genealogy sections are intentionally retired from the graphical
   view. Their detailed data remains available in Direct Team / Level Report. */
body.release-455 .genealogy-command__root,
body.release-455 .genealogy-command__connector,
body.release-455 .genealogy-command__branches,
body.release-455 .genealogy-visual.genealogy-reference {
    display: none !important;
}

/* --------------------------------------------------------------------------
   Public website — approved compact-width / taller page rhythm
   -------------------------------------------------------------------------- */
body.release-455.public-body {
    background: #fff !important;
}

body.release-455 .alp435-site-header {
    background: rgba(255,255,255,.98) !important;
    border-bottom: 1px solid #e7ece9 !important;
}

body.release-455 .alp435-utility-bar {
    min-height: 26px !important;
    font-size: 8.5px !important;
}

body.release-455 .alp435-main-header {
    max-width: 1180px !important;
    min-height: 62px !important;
    margin-inline: auto !important;
    padding-inline: 14px !important;
}

body.release-455 .alp435-brand b {
    font-size: 18px !important;
}

body.release-455 .alp435-primary-nav {
    gap: 16px !important;
}

body.release-455 .alp435-primary-nav a {
    font-size: 10px !important;
}

body.release-455 .alp-page,
body.release-455 .alp-public-435 {
    background: #fff !important;
}

body.release-455 .alp-shell,
body.release-455 .alp435-shell {
    width: min(100% - 28px, 1180px) !important;
    margin-inline: auto !important;
}

body.release-455 .alp-section,
body.release-455 .alp435-section {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
}

body.release-455 .alp-hero,
body.release-455 .alp435-hero {
    min-height: 410px !important;
}

body.release-455 .alp-hero h1,
body.release-455 .alp435-hero h1 {
    font-size: clamp(34px,4.4vw,58px) !important;
    line-height: .98 !important;
}

body.release-455 .alp-product-card,
body.release-455 .alp-card,
body.release-455 .alp-value,
body.release-455 .alp435-feature-grid > * {
    border-color: #e6ece8 !important;
    border-radius: 11px !important;
    box-shadow: none !important;
}

body.release-455 .alp-product-image img {
    max-height: 190px !important;
    object-fit: contain;
}

body.release-455 .alp435-site-footer {
    margin-top: 22px;
}

/* --------------------------------------------------------------------------
   Profile photo: fixed low-KB square source for genealogy and identity pages
   -------------------------------------------------------------------------- */
body.release-455 .profile-photo-field {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border: 1px solid var(--alp455-line);
    border-radius: 10px;
    background: #fafcfb;
}

body.release-455 .profile-photo-preview {
    width: 58px;
    height: 58px;
    overflow: hidden;
    border: 1px solid #d8e4de;
    border-radius: 9px;
    background: #eef6f2;
}

body.release-455 .profile-photo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.release-455 .profile-photo-preview span {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: var(--alp455-emerald);
    font-weight: 900;
}

/* --------------------------------------------------------------------------
   Responsive rules: shrink columns, never shrink text into overlap
   -------------------------------------------------------------------------- */
@media (max-width: 1180px) {
    body.release-455 .ap419-kpi-grid,
    body.release-455 .workspace-grid,
    body.release-455 .function-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 960px) {
    body.release-455 .portal-shell {
        grid-template-columns: 1fr !important;
    }

    body.release-455 .portal-sidebar {
        position: fixed;
        left: 0;
        z-index: 100;
        width: min(82vw, 280px);
        transform: translateX(-101%);
        transition: transform .2s ease;
    }

    body.release-455.sidebar-open .portal-sidebar {
        transform: translateX(0);
    }

    body.release-455 .portal-content {
        padding: 11px !important;
    }

    body.release-455 .genealogy-command__head,
    body.release-455 .network-head {
        grid-template-columns: 1fr !important;
    }

    body.release-455 .network-root-search,
    body.release-455 .network-identity {
        max-width: none;
    }
}

@media (max-width: 680px) {
    body.release-455 .portal-topbar {
        min-height: 52px !important;
        padding: 6px 9px !important;
    }

    body.release-455 .topbar-identity,
    body.release-455 .portal-top-actions > a:not(:first-child) {
        display: none !important;
    }

    body.release-455 .workspace-grid,
    body.release-455 .function-grid,
    body.release-455 .ap419-kpi-grid {
        grid-template-columns: 1fr !important;
    }

    body.release-455 .dash-head,
    body.release-455 .network-head {
        padding: 13px !important;
    }

    body.release-455 .dash-head h1,
    body.release-455 .network-head h1 {
        font-size: 21px !important;
    }

    body.release-455 .genealogy-command {
        padding: 9px !important;
    }

    body.release-455 .genealogy-command__head {
        gap: 8px !important;
    }

    body.release-455 .genealogy-direct-shell {
        min-height: 190px;
        padding-inline: 34px;
    }

    body.release-455 .genealogy-direct-track {
        gap: 22px;
        padding-inline: 18px;
    }

    body.release-455 .genealogy-scroll-arrow {
        width: 27px;
        height: 27px;
    }

    body.release-455 .alp435-primary-nav,
    body.release-455 .alp435-utility-bar {
        display: none !important;
    }

    body.release-455 .alp435-main-header {
        min-height: 58px !important;
    }
}

/* Native checkbox/radio controls must never inherit text-field dimensions. */
body.release-455 input[type="checkbox"],
body.release-455 input[type="radio"] {
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
}

/* Approved public-home proportion: less horizontal sprawl, more vertical rhythm. */
body.release-455 .alp-home-hero {
    width: min(100% - 28px, 1180px) !important;
    min-height: 470px !important;
    margin: 0 auto !important;
    padding: 34px 0 30px !important;
    gap: 28px !important;
}

body.release-455 .ap422-hero-copy {
    max-width: 590px !important;
}

body.release-455 .ap422-hero-copy h1 {
    font-size: clamp(38px, 4.8vw, 62px) !important;
    line-height: .98 !important;
    letter-spacing: -.04em !important;
}

body.release-455 .ap422-hero-copy > p {
    max-width: 570px !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

body.release-455 .ap422-product-stage {
    min-height: 410px !important;
}

body.release-455 .alp435-home-command {
    width: min(100% - 28px, 1180px) !important;
    margin-inline: auto !important;
}

@media (max-width: 860px) {
    body.release-455 .alp-home-hero {
        min-height: 0 !important;
        grid-template-columns: 1fr !important;
        padding-top: 24px !important;
    }

    body.release-455 .ap422-product-stage {
        min-height: 350px !important;
    }
}