/* Dirigon — Preqin-class theme. Navy #1B0F2E, magenta #C2187A. */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
       background: #F5F6FA; color: #1B0F2E; font-size: 14px; }

#topbar { background: #1B0F2E; color: #fff; display: flex; justify-content: space-between;
          align-items: center; padding: 0 24px; height: 52px; position: sticky; top: 0; z-index: 10; }
.brand { font-weight: 700; letter-spacing: 2px; font-size: 17px; }
.brand-sub { font-weight: 400; letter-spacing: 0; font-size: 12px; color: #B9A8D9; margin-left: 12px; }
.topbar-right { display: flex; align-items: center; gap: 14px; }
.asof { font-size: 12px; color: #B9A8D9; }
.badge-grade { background: #C2187A; color: #fff; font-size: 10px; font-weight: 700;
               letter-spacing: 1px; padding: 4px 8px; border-radius: 4px; cursor: default; }

#layout { display: flex; min-height: calc(100vh - 52px); }
#sidebar { width: 210px; background: #fff; border-right: 1px solid #E4E2EE; padding: 16px 0; flex-shrink: 0; }
.nav-section { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;
               color: #8A84A3; padding: 0 20px 10px; }
#sidebar a { display: block; padding: 10px 20px; color: #3D3657; text-decoration: none;
             font-size: 13.5px; border-left: 3px solid transparent; }
#sidebar a:hover { background: #F8F4FB; }
#sidebar a.active { color: #C2187A; border-left-color: #C2187A; background: #FBF0F7; font-weight: 600; }

#main { flex: 1; padding: 24px 28px; max-width: 1280px; }
.loading, .error { padding: 60px; text-align: center; color: #8A84A3; }
.error { color: #B00020; }

.page-title { font-size: 22px; font-weight: 700; margin-bottom: 4px; }
.page-sub { display: block; font-size: 13px; font-weight: 400; color: #8A84A3; margin: 4px 0 20px; }

.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
            gap: 14px; margin-bottom: 22px; }
.kpi { background: #fff; border-radius: 8px; padding: 16px 18px; box-shadow: 0 1px 3px rgba(27,15,46,.07); }
.kpi-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .6px; color: #8A84A3; }
.kpi-value { font-size: 26px; font-weight: 700; margin-top: 6px; }
.kpi-sub { font-size: 11.5px; color: #A39FC0; margin-top: 3px; }

.card { background: #fff; border-radius: 8px; padding: 18px 20px;
        box-shadow: 0 1px 3px rgba(27,15,46,.07); margin-bottom: 20px; }
.card-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.card-title { font-size: 15px; font-weight: 700; }
.card-note { font-size: 12px; color: #8A84A3; margin-bottom: 10px; }
.card canvas { max-height: 320px; }

.chart-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 1000px) { .chart-grid { grid-template-columns: 1fr; } }

details.how { margin-top: 10px; border-top: 1px solid #EEEAF6; padding-top: 8px; }
details.how summary { font-size: 12px; color: #7B5EA7; cursor: pointer; font-weight: 600; }
details.how div { font-size: 12px; color: #5A5470; padding: 8px 0 2px; line-height: 1.55; }

.tabs { display: flex; gap: 0; margin-top: 12px; border-bottom: 1px solid #E4E2EE; }
.tabs button { background: none; border: none; padding: 7px 14px; font-size: 12.5px; cursor: pointer;
               color: #8A84A3; border-bottom: 2px solid transparent; }
.tabs button.active { color: #C2187A; border-bottom-color: #C2187A; font-weight: 600; }
.tab-body { padding-top: 10px; }
.source-note { font-size: 12px; color: #5A5470; line-height: 1.6; background: #F8F4FB;
               border-left: 3px solid #7B5EA7; padding: 10px 12px; border-radius: 0 6px 6px 0; }

table.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .5px;
                 color: #8A84A3; padding: 8px 10px; border-bottom: 2px solid #E4E2EE;
                 cursor: pointer; user-select: none; white-space: nowrap; }
.data-table th:hover { color: #C2187A; }
.data-table th.sorted-asc::after { content: " ▲"; } .data-table th.sorted-desc::after { content: " ▼"; }
.data-table td { padding: 8px 10px; border-bottom: 1px solid #F0EDF7; }
.data-table tr:hover td { background: #FAF7FD; }
.data-table td.num, .data-table th.num { text-align: right; }
.data-table a { color: #2B1A4A; font-weight: 600; text-decoration: none; }
.data-table a:hover { color: #C2187A; }

.btn-export { background: #fff; border: 1px solid #D9D4E8; color: #3D3657; font-size: 12px;
              padding: 5px 12px; border-radius: 5px; cursor: pointer; }
.btn-export:hover { border-color: #C2187A; color: #C2187A; }

.badge { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 10px; }
.badge-par_plus { background: #FBE3F1; color: #C2187A; }
.badge-healthy { background: #EDE7F6; color: #7B5EA7; }
.badge-watch { background: #E3EEFA; color: #3D7BD9; }
.badge-stressed { background: #E8E3F0; color: #1B0F2E; }
.badge-conf-High { background: #E4F4EA; color: #1B7A43; }
.badge-conf-Medium { background: #FDF3E0; color: #B26A00; }
.badge-conf-Low { background: #FBE3E3; color: #B00020; }

.search-box { width: 280px; padding: 7px 12px; border: 1px solid #D9D4E8; border-radius: 6px;
              font-size: 13px; margin-bottom: 14px; }
.search-box:focus { outline: none; border-color: #C2187A; }

.tranche { border: 1px solid #EEEAF6; border-radius: 8px; margin-bottom: 12px; overflow: hidden; }
.tranche-head { background: #F8F4FB; padding: 10px 14px; font-size: 13px; font-weight: 600;
                display: flex; gap: 18px; flex-wrap: wrap; }
.tranche-head span { color: #5A5470; font-weight: 400; }
.tranche table { font-size: 12.5px; }
.back-link { font-size: 12.5px; color: #7B5EA7; text-decoration: none; display: inline-block; margin-bottom: 14px; }
.back-link:hover { color: #C2187A; }