/* =========================================================
   ALLIANCE NEXT — SAFE ENTERPRISE UI POLISH
   CSS ONLY — NO DOM / JS / ROUTE CHANGES
   ========================================================= */

:root{
  --ux-bg:#050d14;
  --ux-sidebar:#071722;
  --ux-sidebar-2:#06121b;
  --ux-header:#071823;
  --ux-panel:#091b27;
  --ux-panel-2:#0b202d;
  --ux-line:#17384b;
  --ux-line-soft:#112d3d;
  --ux-text:#dcecf3;
  --ux-muted:#7391a1;
  --ux-accent:#17add5;
  --ux-green:#35d996;
  --ux-amber:#edbb58;
  --ux-red:#ff7f89;
}

/* ---------- GLOBAL ---------- */

html,
body{
  background:
    radial-gradient(circle at 22% 0%,rgba(12,92,126,.10),transparent 30%),
    var(--ux-bg) !important;
}

body{
  color:var(--ux-text) !important;
  font-family:Inter,"Segoe UI",Arial,sans-serif !important;
}

/* ---------- MAIN DESKTOP SHELL ---------- */

@media (min-width:901px){

  #app{
    grid-template-columns:238px minmax(0,1fr) !important;
    min-height:100vh !important;
  }

  /* ---------- SIDEBAR ---------- */

  #app > aside{
    position:sticky !important;
    top:0 !important;
    height:100vh !important;
    min-height:100vh !important;

    padding:0 !important;

    display:flex !important;
    flex-direction:column !important;

    overflow:hidden !important;

    background:
      linear-gradient(
        180deg,
        var(--ux-sidebar) 0%,
        var(--ux-sidebar-2) 100%
      ) !important;

    border-right:1px solid var(--ux-line) !important;

    box-shadow:
      8px 0 30px rgba(0,0,0,.14) !important;
  }

  #app > aside .side-head{
    min-height:70px !important;

    margin:0 !important;
    padding:15px 15px !important;

    border-bottom:1px solid var(--ux-line-soft) !important;
  }

  #app > aside .logo-box{
    width:38px !important;
    height:38px !important;

    border-radius:9px !important;
  }

  #app > aside .side-head .brand{
    font-size:14px !important;
    letter-spacing:1.25px !important;
  }

  #app > aside .side-head small{
    margin-top:3px !important;

    color:#678393 !important;

    font-size:8px !important;
    letter-spacing:1.6px !important;
  }

  /* Search */

  #app > aside .side-search{
    min-height:39px !important;

    margin:12px 11px 8px !important;
    padding:8px 10px !important;

    border:1px solid #1c4155 !important;
    border-radius:8px !important;

    background:#081c29 !important;

    color:#89a5b4 !important;

    font-size:10px !important;
  }

  #app > aside .side-search kbd{
    margin-left:auto !important;

    border:1px solid #193c50 !important;
    border-radius:5px !important;

    background:#0d2a3b !important;
    color:#7193a5 !important;

    font-size:8px !important;
  }

  /* Sidebar scrolling */

  #app > aside nav{
    flex:1 !important;

    display:block !important;

    margin:0 !important;
    padding:5px 9px 18px !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    scrollbar-width:thin;
    scrollbar-color:#244b5f transparent;
  }

  #app > aside nav::-webkit-scrollbar{
    width:5px;
  }

  #app > aside nav::-webkit-scrollbar-thumb{
    background:#244b5f;
    border-radius:10px;
  }

  /* Groups */

  #app > aside nav .nav-group{
    display:block !important;

    margin:3px 0 10px !important;
    padding:0 !important;
  }

  #app > aside nav .nav-group > label{
    display:block !important;

    margin:0 !important;
    padding:10px 9px 5px !important;

    color:#547789 !important;

    font-size:8px !important;
    font-weight:800 !important;

    letter-spacing:1.3px !important;
    line-height:1.2 !important;

    text-transform:uppercase !important;
  }

  /* All sidebar menu items */

  #app > aside nav button,
  #app > aside nav a,
  #app > aside nav .gpi-nav-link,
  #app > aside nav .direct-module-link{
    width:100% !important;
    min-height:36px !important;

    display:flex !important;
    align-items:center !important;
    gap:9px !important;

    margin:1px 0 !important;
    padding:7px 9px !important;

    border:1px solid transparent !important;
    border-radius:7px !important;

    background:transparent !important;

    color:#91acb9 !important;

    text-decoration:none !important;
    text-align:left !important;

    font-size:10px !important;
    line-height:1.25 !important;

    transition:
      background .14s ease,
      border-color .14s ease,
      color .14s ease !important;
  }

  #app > aside nav button:hover,
  #app > aside nav a:hover{
    background:#0b2838 !important;
    border-color:#163f54 !important;
    color:#e7f4f9 !important;
  }

  #app > aside nav button.active{
    background:
      linear-gradient(
        90deg,
        rgba(20,163,204,.19),
        rgba(14,50,69,.24)
      ) !important;

    border-color:#205872 !important;

    box-shadow:
      inset 3px 0 0 var(--ux-accent) !important;

    color:#fff !important;
  }

  #app > aside nav i{
    flex:0 0 23px !important;

    width:23px !important;
    height:23px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:6px !important;

    background:#0b2635 !important;
    color:#67a0b8 !important;

    font-size:8px !important;
    font-style:normal !important;
    font-weight:800 !important;
  }

  #app > aside nav button.active i{
    background:#0d4055 !important;
    color:#63ddfa !important;
  }

  #app > aside nav em{
    margin-left:auto !important;

    padding:2px 6px !important;

    border-radius:12px !important;

    background:#0d3a50 !important;
    color:#84dcef !important;

    font-size:8px !important;
  }

  /* Sidebar footer */

  #app > aside .side-bottom{
    flex:0 0 auto !important;

    margin:0 !important;
    padding:9px 11px 12px !important;

    background:#06121b !important;

    border-top:1px solid var(--ux-line-soft) !important;
  }

  #app > aside .env{
    margin:0 0 6px !important;

    padding:8px 6px !important;

    border:1px solid #165841 !important;
    border-radius:7px !important;

    background:#07271d !important;

    color:#6fe3aa !important;

    font-size:8px !important;
    letter-spacing:.85px !important;
  }

  #app > aside #logout{
    width:100% !important;
    min-height:33px !important;

    justify-content:center !important;

    border-radius:7px !important;

    color:#718e9d !important;
  }

  #app > aside #logout:hover{
    background:#111f29 !important;
    color:#fff !important;
  }

  /* ---------- HEADER ---------- */

  #app > main > header{
    position:sticky !important;

    top:0 !important;
    z-index:30 !important;

    height:66px !important;
    min-height:66px !important;

    padding:0 22px !important;

    background:
      rgba(6,21,31,.96) !important;

    backdrop-filter:blur(14px) !important;

    border-bottom:1px solid var(--ux-line) !important;

    box-shadow:
      0 7px 25px rgba(0,0,0,.12) !important;
  }

  #breadcrumb{
    color:#617f90 !important;

    font-size:8px !important;
    letter-spacing:.25px !important;
  }

  #pageTitle{
    margin:3px 0 0 !important;

    color:#edf7fb !important;

    font-size:16px !important;
    font-weight:760 !important;

    letter-spacing:-.15px !important;
  }

  .top-actions{
    gap:8px !important;
  }

  .health{
    min-height:29px !important;

    display:flex !important;
    align-items:center !important;

    padding:0 9px !important;

    border:1px solid #18513f !important;
    border-radius:16px !important;

    background:#07271e !important;

    color:#74dea9 !important;

    font-size:8px !important;
  }

  .clock{
    color:#6b8898 !important;

    font-size:8px !important;
  }

  .icon-btn{
    width:31px !important;
    height:31px !important;

    border:1px solid #1f4255 !important;
    border-radius:7px !important;

    background:#0a2130 !important;

    color:#8ca8b6 !important;
  }

  #identity{
    min-width:105px !important;

    padding-left:10px !important;

    border-left:1px solid var(--ux-line) !important;

    color:#e4f1f6 !important;

    font-size:9px !important;
  }

  #identity span{
    color:#668493 !important;

    font-size:8px !important;
  }

  /* ---------- CONTENT ---------- */

  #content{
    width:100% !important;
    max-width:1660px !important;

    margin:0 auto !important;

    padding:
      20px
      24px
      50px !important;
  }

  .hero{
    margin:0 0 15px !important;

    align-items:center !important;
  }

  .hero h3{
    margin:0 0 4px !important;

    color:#e8f4f8 !important;

    font-size:14px !important;
  }

  .hero p{
    color:#708c9b !important;

    font-size:9px !important;
  }

  /* ---------- BUTTONS ---------- */

  .btn{
    min-height:32px !important;

    padding:6px 10px !important;

    border:1px solid #21475b !important;
    border-radius:7px !important;

    background:#0a2433 !important;

    color:#c5dce5 !important;

    font-size:9px !important;
    font-weight:650 !important;

    box-shadow:none !important;
  }

  .btn:hover{
    background:#0d3043 !important;

    border-color:#2b6681 !important;

    color:#fff !important;
  }

  .btn.primary{
    border-color:#1798bd !important;

    background:#0788aa !important;

    color:#fff !important;
  }

  .btn.danger{
    background:#31181f !important;

    border-color:#71434b !important;

    color:#ff9da5 !important;
  }

  /* ---------- CARDS / PANELS ---------- */

  .cards{
    gap:10px !important;
  }

  .grid2{
    gap:11px !important;

    margin-top:11px !important;
  }

  .card,
  .panel{
    border:1px solid var(--ux-line) !important;

    border-radius:10px !important;

    background:
      linear-gradient(
        180deg,
        rgba(10,30,43,.98),
        rgba(6,22,32,.98)
      ) !important;

    box-shadow:
      0 10px 32px rgba(0,0,0,.15) !important;
  }

  .card{
    min-height:86px !important;

    padding:14px 15px !important;
  }

  .panel{
    margin-top:12px !important;

    padding:15px !important;
  }

  .grid2 .panel{
    margin-top:0 !important;
  }

  .card small{
    color:#668696 !important;

    font-size:8px !important;
  }

  .card strong{
    margin:7px 0 2px !important;

    color:#f0f8fb !important;

    font-size:21px !important;
  }

  .panel-head{
    margin-bottom:12px !important;
  }

  .panel h3,
  .panel-head h3{
    color:#e5f2f7 !important;

    font-size:11px !important;
  }

  .muted{
    color:#6f8998 !important;
  }

  /* ---------- STATUS ROWS ---------- */

  .status-list{
    gap:0 !important;
  }

  .status-row{
    min-height:50px !important;

    grid-template-columns:
      10px
      minmax(0,1fr)
      auto !important;

    gap:9px !important;

    padding:8px 2px !important;

    border-bottom:
      1px solid var(--ux-line-soft) !important;
  }

  .status-row b{
    color:#dcebf2 !important;

    font-size:9px !important;
  }

  .status-row small{
    color:#668594 !important;

    font-size:8px !important;
  }

  /* Never allow vertical badges again */

  .badge{
    min-width:55px !important;
    max-width:180px !important;

    min-height:21px !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    padding:4px 8px !important;

    border-radius:20px !important;

    white-space:nowrap !important;

    writing-mode:horizontal-tb !important;
    text-orientation:mixed !important;

    font-size:8px !important;

    line-height:1 !important;
  }

  /* ---------- TABLES ---------- */

  .table-wrap{
    border:
      1px solid var(--ux-line) !important;

    border-radius:8px !important;

    background:#061620 !important;

    overflow:auto !important;
  }

  table{
    border-collapse:separate !important;
    border-spacing:0 !important;
  }

  th{
    padding:8px 9px !important;

    background:#0c2635 !important;

    border-bottom:
      1px solid #21485c !important;

    color:#7796a6 !important;

    font-size:7.5px !important;
    font-weight:800 !important;

    letter-spacing:.55px !important;
  }

  td{
    padding:9px !important;

    background:#061620 !important;

    border-bottom:
      1px solid #102c3b !important;

    color:#bfd4dd !important;

    font-size:8px !important;
  }

  tbody tr:hover td{
    background:#092230 !important;
  }

  td b{
    color:#edf7fa !important;
  }

  /* ---------- FORMS ---------- */

  input,
  select,
  textarea{
    border:
      1px solid #21475a !important;

    border-radius:7px !important;

    background:#061721 !important;

    color:#dbeaf0 !important;
  }

  input:focus,
  select:focus,
  textarea:focus{
    border-color:#2797b9 !important;

    box-shadow:
      0 0 0 2px rgba(39,151,185,.12) !important;
  }

}

/* ---------- SMALLER DESKTOP ---------- */

@media (min-width:901px) and (max-width:1180px){

  #app{
    grid-template-columns:
      215px
      minmax(0,1fr) !important;
  }

  #content{
    padding-left:17px !important;
    padding-right:17px !important;
  }

}

/* ---------- MOBILE: DO NOT REBUILD ORIGINAL LAYOUT ---------- */

@media (max-width:900px){

  .card,
  .panel{
    border-color:#17384b !important;

    background:#081b27 !important;
  }

}


/* ===== SAFE_UI_POLISH_PHASE2_START ===== */

@media (min-width:901px){

  /* ----- SIDEBAR READABILITY ----- */

  #app{
    grid-template-columns:252px minmax(0,1fr) !important;
  }

  #app > aside .side-head{
    min-height:74px !important;
    padding:16px 16px !important;
  }

  #app > aside .side-head .brand{
    font-size:15px !important;
    letter-spacing:1.2px !important;
  }

  #app > aside .side-head small{
    font-size:8.5px !important;
  }

  #app > aside .side-search{
    min-height:41px !important;
    margin:13px 12px 10px !important;
    padding:9px 11px !important;
    font-size:10.5px !important;
  }

  #app > aside nav{
    padding:5px 10px 18px !important;
  }

  #app > aside nav .nav-group{
    margin-bottom:12px !important;
  }

  #app > aside nav .nav-group > label{
    padding:10px 10px 6px !important;
    font-size:8.5px !important;
    letter-spacing:1.35px !important;
  }

  #app > aside nav button,
  #app > aside nav a,
  #app > aside nav .gpi-nav-link,
  #app > aside nav .direct-module-link{
    min-height:39px !important;
    padding:8px 10px !important;
    font-size:10.5px !important;
    border-radius:8px !important;
  }

  #app > aside nav i{
    flex:0 0 25px !important;
    width:25px !important;
    height:25px !important;
    font-size:8.5px !important;
  }

  /* ----- SIDEBAR FOOTER ----- */

  #app > aside .side-bottom{
    padding:10px 12px 13px !important;
  }

  #app > aside .env{
    min-height:31px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 0 7px !important;
    font-size:8.5px !important;
    border-radius:8px !important;
  }

  #app > aside #logout{
    min-height:35px !important;
    margin-top:2px !important;
    border:1px solid transparent !important;
    font-size:9px !important;
  }

  #app > aside #logout:hover{
    border-color:#253e4d !important;
  }

  /* ----- TOP HEADER ----- */

  #app > main > header{
    height:72px !important;
    min-height:72px !important;
    padding:0 25px !important;
  }

  #breadcrumb{
    font-size:9px !important;
    margin-bottom:3px !important;
  }

  #pageTitle{
    font-size:18px !important;
    line-height:1.15 !important;
  }

  .top-actions{
    gap:10px !important;
  }

  .health{
    min-height:31px !important;
    padding:0 11px !important;
    font-size:8.5px !important;
  }

  .clock{
    font-size:8.5px !important;
    white-space:nowrap !important;
  }

  .icon-btn{
    width:33px !important;
    height:33px !important;
  }

  #identity{
    min-width:124px !important;
    padding-left:12px !important;
    font-size:9.5px !important;
    line-height:1.25 !important;
  }

  #identity span{
    display:block !important;
    margin-top:2px !important;
    font-size:8px !important;
  }

  /* ----- MAIN CONTENT SPACING ----- */

  #content{
    max-width:1540px !important;
    padding:22px 26px 56px !important;
  }

  .hero{
    margin-bottom:17px !important;
  }

  .hero h3{
    font-size:15px !important;
  }

  .hero p{
    font-size:9.5px !important;
  }

  /* ----- CARDS ----- */

  .card{
    min-height:92px !important;
    padding:15px 16px !important;
  }

  .panel{
    padding:16px !important;
    margin-top:13px !important;
  }

  .panel h3,
  .panel-head h3{
    font-size:11.5px !important;
  }

  /* ----- TABLE LEGIBILITY ----- */

  th{
    padding:9px 10px !important;
    font-size:8px !important;
  }

  td{
    padding:10px !important;
    font-size:8.5px !important;
    line-height:1.4 !important;
  }

  /* ----- FLOATING DATABASE TRANSACTIONS ----- */

  #liveTxButton{
    left:14px !important;
    right:auto !important;
    bottom:58px !important;

    min-width:178px !important;
    min-height:34px !important;

    padding:7px 12px !important;

    border:1px solid #15895c !important;
    border-radius:8px !important;

    background:#06291e !important;
    color:#52e49d !important;

    box-shadow:
      0 10px 26px rgba(0,0,0,.28) !important;

    font-size:8.5px !important;
    font-weight:800 !important;
    letter-spacing:.45px !important;
  }

  #liveTxButton:hover{
    background:#093a2b !important;
    border-color:#29c981 !important;
    color:#8dffc5 !important;
  }

}

/* medium desktop */
@media (min-width:901px) and (max-width:1250px){

  #app{
    grid-template-columns:230px minmax(0,1fr) !important;
  }

  #content{
    padding-left:19px !important;
    padding-right:19px !important;
  }

}

/* ===== SAFE_UI_POLISH_PHASE2_END ===== */

/* ===== SAFE_UI_POLISH_PHASE3_START ===== */

@media (min-width:901px){

  /* --------------------------------------------------
     SIDEBAR — FINAL ENTERPRISE FINISH
  -------------------------------------------------- */

  #app > aside nav .nav-group > label{
    position:relative !important;
    margin-top:3px !important;
    padding:11px 10px 6px !important;
    color:#6d91a3 !important;
    font-size:8px !important;
    font-weight:800 !important;
    letter-spacing:1.45px !important;
  }

  #app > aside nav .nav-group > label::after{
    content:"";
    display:block;
    height:1px;
    margin-top:7px;
    background:
      linear-gradient(
        90deg,
        rgba(39,111,143,.45),
        transparent
      );
  }

  #app > aside nav button,
  #app > aside nav a{
    position:relative !important;
  }

  #app > aside nav button.active{
    background:
      linear-gradient(
        90deg,
        rgba(10,138,181,.26),
        rgba(8,41,57,.38)
      ) !important;

    border-color:#22708d !important;

    box-shadow:
      inset 3px 0 0 #18c1ec,
      0 4px 12px rgba(0,0,0,.10) !important;
  }

  #app > aside nav button.active::after{
    content:"";
    position:absolute;
    right:9px;
    width:5px;
    height:5px;
    border-radius:50%;
    background:#40d7f5;
    box-shadow:0 0 8px rgba(64,215,245,.8);
  }

  /* --------------------------------------------------
     SIDEBAR FOOTER
  -------------------------------------------------- */

  #app > aside .side-bottom{
    padding:11px 12px 12px !important;
  }

  #app > aside .env{
    width:100% !important;
    min-height:32px !important;

    margin:0 0 7px !important;

    background:
      linear-gradient(
        90deg,
        #08271e,
        #0a3025
      ) !important;

    border:1px solid #176347 !important;

    box-shadow:
      inset 0 0 18px rgba(41,196,121,.04) !important;
  }

  #app > aside .env span{
    width:6px !important;
    height:6px !important;
    margin-right:7px !important;

    background:#35dd92 !important;

    box-shadow:
      0 0 9px rgba(53,221,146,.8) !important;
  }

  #liveTxButton{
    left:12px !important;
    bottom:50px !important;

    width:calc(252px - 24px) !important;
    min-width:0 !important;

    min-height:32px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    padding:6px 9px !important;

    border-radius:7px !important;

    font-size:8px !important;
    letter-spacing:.65px !important;
  }

  #app > aside #logout{
    margin-top:39px !important;
  }

  /* --------------------------------------------------
     HEADER / COMMAND BAR
  -------------------------------------------------- */

  #app > main > header{
    background:
      linear-gradient(
        90deg,
        rgba(5,18,27,.98),
        rgba(7,28,40,.97)
      ) !important;
  }

  #pageTitle{
    color:#f1f9fc !important;
    text-shadow:0 1px 14px rgba(255,255,255,.03);
  }

  .top-actions{
    min-height:40px !important;
  }

  .health{
    border-color:#18573f !important;

    background:
      linear-gradient(
        180deg,
        #08291f,
        #072219
      ) !important;

    box-shadow:
      inset 0 0 12px rgba(44,203,126,.05) !important;
  }

  .health span{
    width:6px !important;
    height:6px !important;
  }

  #identity{
    padding:7px 12px !important;

    border:1px solid #18394b !important;
    border-radius:8px !important;

    background:#081c29 !important;

    text-align:right !important;
  }

  #identity span{
    color:#6f91a2 !important;
  }

  /* --------------------------------------------------
     CONTENT HIERARCHY
  -------------------------------------------------- */

  #content{
    max-width:1510px !important;
  }

  #content > .panel,
  #content > .grid2,
  #content > .cards,
  #content > .hero{
    position:relative;
  }

  .panel{
    border-color:#183b4f !important;
  }

  .panel:hover{
    border-color:#1b455b !important;
  }

  .panel-head{
    min-height:28px !important;
  }

  .panel-head h3,
  .panel > h3{
    font-weight:750 !important;
    letter-spacing:.02em !important;
  }

  /* --------------------------------------------------
     DASHBOARD KPI CARDS
  -------------------------------------------------- */

  .cards .card{
    border-color:#17384a !important;
  }

  .cards .card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:2px;

    background:
      linear-gradient(
        90deg,
        rgba(26,173,213,.75),
        transparent 72%
      );

    opacity:.55;
  }

  .card strong{
    font-weight:760 !important;
    letter-spacing:-.35px !important;
  }

  /* --------------------------------------------------
     TABLE / WORK QUEUE
  -------------------------------------------------- */

  .table-wrap{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.015) !important;
  }

  th{
    height:34px !important;
    vertical-align:middle !important;
  }

  tbody tr{
    transition:background .12s ease !important;
  }

  tbody tr:hover td{
    background:#092635 !important;
  }

  /* --------------------------------------------------
     CONNECTOR PANELS
  -------------------------------------------------- */

  #content > .panel{
    margin-top:14px !important;
  }

  #content > .panel + .panel{
    margin-top:16px !important;
  }

  .status-row{
    border-color:#123445 !important;
  }

  .status-row:last-child{
    border-bottom:0 !important;
  }

  /* --------------------------------------------------
     BUTTON CONSISTENCY
  -------------------------------------------------- */

  .btn,
  button{
    transition:
      background .14s ease,
      border-color .14s ease,
      color .14s ease,
      transform .12s ease !important;
  }

  .btn:active{
    transform:translateY(1px);
  }

  /* --------------------------------------------------
     SCROLLBAR
  -------------------------------------------------- */

  *{
    scrollbar-width:thin;
    scrollbar-color:#245269 transparent;
  }

  *::-webkit-scrollbar{
    width:6px;
    height:6px;
  }

  *::-webkit-scrollbar-thumb{
    background:#245269;
    border-radius:10px;
  }

  *::-webkit-scrollbar-track{
    background:transparent;
  }
}

/* medium desktop */
@media (min-width:901px) and (max-width:1250px){

  #liveTxButton{
    width:calc(230px - 24px) !important;
  }

}

/* ===== SAFE_UI_POLISH_PHASE3_END ===== */

/* ===== PLATFORM_HEALTH_COMPACT_PHASE4_START ===== */

@media (min-width:901px){

  /* Main health container */

  .dashboard-health-panel{
    padding:17px !important;
    overflow:hidden !important;
  }

  .dashboard-health-panel > .panel-head{
    min-height:48px !important;
    margin:-2px 0 14px !important;
    padding:0 2px 13px !important;

    border-bottom:1px solid #17394b !important;
  }

  .dashboard-health-panel > .panel-head h3{
    margin:0 0 4px !important;

    color:#eef8fb !important;

    font-size:13px !important;
    font-weight:800 !important;
    letter-spacing:.01em !important;
  }

  .dashboard-health-panel > .panel-head small{
    color:#638597 !important;

    font-size:8px !important;
    font-weight:700 !important;
    letter-spacing:.7px !important;
  }

  .dashboard-health-panel > .panel-head > span .badge,
  .dashboard-health-panel > .panel-head > .badge{
    min-width:62px !important;
    min-height:22px !important;

    border:1px solid rgba(67,214,154,.35) !important;

    box-shadow:
      0 0 15px rgba(39,205,138,.08) !important;
  }

  /* 15 modules -> 5 columns x 3 rows */

  .dashboard-health-panel .status-list{
    display:grid !important;

    grid-template-columns:
      repeat(5,minmax(0,1fr)) !important;

    gap:8px !important;
  }

  /* Module card */

  .dashboard-health-panel .module-health-card{
    position:relative !important;

    min-width:0 !important;
    min-height:118px !important;

    display:flex !important;
    flex-direction:column !important;

    padding:11px 11px 10px !important;

    border:1px solid #17394b !important;
    border-radius:8px !important;

    background:
      linear-gradient(
        145deg,
        #0a202d 0%,
        #071923 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.015),
      0 5px 15px rgba(0,0,0,.08) !important;

    overflow:hidden !important;

    transition:
      border-color .14s ease,
      background .14s ease,
      transform .14s ease !important;
  }

  .dashboard-health-panel .module-health-card::before{
    content:"";

    position:absolute;

    left:0;
    top:0;
    bottom:0;

    width:2px;

    background:
      linear-gradient(
        180deg,
        #18afd4,
        rgba(24,175,212,.08)
      );

    opacity:.7;
  }

  .dashboard-health-panel .module-health-card:hover{
    border-color:#24556c !important;

    background:
      linear-gradient(
        145deg,
        #0c2635,
        #081d29
      ) !important;

    transform:translateY(-1px);
  }

  /* Top line */

  .dashboard-health-panel .module-health-top{
    min-height:22px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:6px !important;

    margin-bottom:7px !important;
  }

  .dashboard-health-panel .module-health-number{
    color:#567b8d !important;

    font-size:7px !important;
    font-weight:800 !important;

    letter-spacing:.8px !important;

    white-space:nowrap !important;
  }

  .dashboard-health-panel
  .module-health-top .badge{
    min-width:45px !important;
    min-height:18px !important;

    padding:3px 6px !important;

    font-size:7px !important;
  }

  /* Name */

  .dashboard-health-panel .module-health-title{
    min-height:31px !important;

    display:flex !important;
    align-items:flex-start !important;

    color:#dcecf3 !important;

    font-size:9.5px !important;
    font-weight:750 !important;

    line-height:1.25 !important;

    overflow-wrap:anywhere !important;
  }

  /* Meta */

  .dashboard-health-panel .module-health-meta{
    margin-top:4px !important;

    color:#688696 !important;

    font-size:7px !important;
    font-weight:600 !important;

    line-height:1.3 !important;

    text-transform:uppercase !important;
    letter-spacing:.3px !important;

    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  /* Action */

  .dashboard-health-panel .module-health-actions{
    margin-top:auto !important;
    padding-top:8px !important;

    display:flex !important;
    justify-content:flex-end !important;
  }

  .dashboard-health-panel .module-open-btn{
    width:auto !important;
    min-width:52px !important;
    min-height:24px !important;

    padding:4px 8px !important;

    border:1px solid #214b60 !important;
    border-radius:6px !important;

    background:#0a2635 !important;
    color:#a8c4d0 !important;

    font-size:7px !important;
    font-weight:800 !important;
    letter-spacing:.5px !important;
  }

  .dashboard-health-panel .module-open-btn:hover{
    border-color:#2585a5 !important;

    background:#0d3548 !important;
    color:#fff !important;
  }

}

/* 4 columns on medium desktop */

@media (min-width:1101px) and (max-width:1450px){

  .dashboard-health-panel .status-list{
    grid-template-columns:
      repeat(4,minmax(0,1fr)) !important;
  }

}

/* 3 columns on compact desktop */

@media (min-width:901px) and (max-width:1100px){

  .dashboard-health-panel .status-list{
    grid-template-columns:
      repeat(3,minmax(0,1fr)) !important;
  }

}

/* ===== PLATFORM_HEALTH_COMPACT_PHASE4_END ===== */

.internal-ready-green{
  background:#087f5b!important;
  border-color:#34d399!important;
  color:#fff!important;
}

.internal-ready-green:hover{
  background:#059669!important;
}

.external-evidence-pending{
  background:#071821!important;
  border-color:#425866!important;
  color:#8298a5!important;
}

.source-evidence-green{
  background:#087f5b!important;
  border:1px solid #34d399!important;
  color:#fff!important;
}

.source-evidence-green:hover{
  background:#059669!important;
}

.external-evidence-pending{
  background:#071821!important;
  border-color:#425866!important;
  color:#8298a5!important;
}

tr[data-source-evidence-ready="1"] .source-evidence-green{
  background:#087f5b!important;
  border:1px solid #34d399!important;
  color:#fff!important;
  box-shadow:0 0 0 1px rgba(52,211,153,.10)!important;
}

tr[data-source-evidence-ready="1"] .source-evidence-green:hover{
  background:#059669!important;
  border-color:#6ee7b7!important;
}