:root {
  --bl-ink:#16222e; --bl-muted:#647688; --bl-blue:#1f6feb; --bl-teal:#39c0c8;
  --bl-line:#dde5ee; --bl-bg:#f4f7fb; --bl-panel:#ffffff;
}
* { box-sizing: border-box; }
body.bl { margin:0; font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--bl-ink); background:var(--bl-bg); line-height:1.5; }
a { color:var(--bl-blue); }

/* Nav */
.bl-nav { background:#fff; border-bottom:1px solid var(--bl-line); position:sticky; top:0; z-index:20; }
.bl-nav__inner { max-width:1160px; margin:0 auto; display:flex; align-items:center; gap:24px; padding:0 24px; height:60px; }
.bl-nav__brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--bl-ink); font-weight:700; }
.bl-nav__brand small { display:block; font-weight:500; color:var(--bl-muted); font-size:11px; }
.bl-nav__mark { color:var(--bl-blue); font-size:22px; }
.bl-nav__links { display:flex; gap:6px; margin-left:8px; flex:1; }
.bl-nav__links a { text-decoration:none; color:var(--bl-muted); padding:8px 12px; border-radius:8px; font-size:14px; }
.bl-nav__links a:hover { background:#eef3fa; color:var(--bl-ink); }
.bl-nav__links a.is-active { color:var(--bl-blue); background:#eaf2ff; font-weight:600; }
.bl-nav__right { display:flex; align-items:center; gap:14px; }
.bl-lang button { border:1px solid var(--bl-line); background:#fff; padding:3px 8px; cursor:pointer; font-size:12px; }
.bl-lang button:first-child { border-radius:6px 0 0 6px; } .bl-lang button:last-child { border-radius:0 6px 6px 0; border-left:0; }
.bl-lang button.is-active { background:var(--bl-blue); color:#fff; border-color:var(--bl-blue); }
.bl-avatar summary { list-style:none; display:flex; align-items:center; gap:8px; cursor:pointer; font-size:14px; }
.bl-avatar summary::-webkit-details-marker { display:none; }
.bl-avatar__circle { width:30px; height:30px; border-radius:50%; background:var(--bl-teal); color:#fff; display:grid; place-items:center; font-size:12px; font-weight:700; }
.bl-avatar { position:relative; }
.bl-avatar__menu { position:absolute; right:0; top:42px; background:#fff; border:1px solid var(--bl-line); border-radius:10px; box-shadow:0 12px 30px rgba(0,0,0,.12); min-width:200px; padding:8px; display:flex; flex-direction:column; }
.bl-avatar__menu a { padding:8px 10px; border-radius:6px; text-decoration:none; color:var(--bl-ink); }
.bl-avatar__menu a:hover { background:#f1f5fa; }
.bl-avatar__meta { font-size:11.5px; color:var(--bl-muted); padding:6px 10px; border-bottom:1px solid var(--bl-line); margin-bottom:4px; }

.bl-main { max-width:1160px; margin:0 auto; padding:28px 24px 48px; }
.bl-h1 { font-size:26px; margin:0 0 4px; letter-spacing:-.3px; }
.bl-sub { color:var(--bl-muted); margin:0 0 24px; }
.bl-back { display:inline-block; margin-bottom:14px; text-decoration:none; font-size:13.5px; }
.bl-subh { margin:22px 0 8px; font-size:15px; }
.bl-muted { color:var(--bl-muted); }
.bl-tag { background:#fff2d6; color:#8a5a00; font-size:11px; padding:1px 7px; border-radius:999px; }

/* KPIs */
.bl-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px; }
@media(max-width:820px){ .bl-kpis{ grid-template-columns:1fr 1fr; } }
.bl-kpi { background:var(--bl-panel); border:1px solid var(--bl-line); border-radius:12px; padding:18px; }
.bl-kpi__label { display:block; color:var(--bl-muted); font-size:12.5px; }
.bl-kpi__value { display:block; font-size:24px; font-weight:700; margin-top:6px; }

.bl-cols { display:grid; grid-template-columns:1.4fr 1fr; gap:20px; }
@media(max-width:820px){ .bl-cols{ grid-template-columns:1fr; } }
.bl-panel { background:var(--bl-panel); border:1px solid var(--bl-line); border-radius:12px; padding:20px; margin-bottom:20px; }
.bl-panel h2 { margin:0 0 14px; font-size:17px; }
.bl-feed { list-style:none; margin:0; padding:0; }
.bl-feed li { padding:9px 0; border-bottom:1px solid var(--bl-line); font-size:14px; display:flex; gap:10px; align-items:center; }
.bl-feed__dot { width:8px; height:8px; border-radius:50%; background:var(--bl-teal); flex:none; }
.bl-alerts { list-style:none; margin:0; padding:0; }
.bl-alert { padding:11px 14px; border-radius:9px; margin-bottom:10px; font-size:14px; }
.bl-alert a { text-decoration:none; color:inherit; font-weight:600; }
.bl-alert--warn { background:#fff5e0; color:#8a5a00; }
.bl-alert--bad { background:#fde7e7; color:#9b1c1c; }
.bl-alert--info { background:#e9f1ff; color:#1f4f9b; }

.bl-role { font-size:10.5px; background:#eaf2ff; color:var(--bl-blue); padding:1px 7px; border-radius:999px; margin-left:8px; font-weight:600; }
.bl-scopebanner { background:#fff5e0; border:1px solid #f0d79a; color:#8a5a00; padding:10px 14px; border-radius:9px; font-size:13.5px; margin:-12px 0 22px; }
.bl-export { display:flex; align-items:center; gap:8px; margin-top:8px; flex-wrap:wrap; }
.bl-export__label { font-size:13px; color:var(--bl-muted); }
.bl-export__note { font-size:12px; color:var(--bl-muted); }
.bl-btn--export { background:#eaf2ff; border-color:#cfe0ff; color:var(--bl-blue); text-decoration:none; font-weight:600; padding:6px 12px; }
.bl-doc-locked { color:var(--bl-muted); }

/* List header / search */
.bl-listhead { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
.bl-search { display:flex; gap:8px; align-items:center; }
.bl-search input[type=search] { padding:8px 12px; border:1px solid var(--bl-line); border-radius:8px; min-width:230px; }

/* Tables */
.bl-table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--bl-line); border-radius:12px; overflow:hidden; }
.bl-table th, .bl-table td { text-align:left; padding:12px 16px; border-bottom:1px solid var(--bl-line); font-size:14px; }
.bl-table th { background:#f7fafd; color:var(--bl-muted); font-weight:600; font-size:12.5px; text-transform:uppercase; letter-spacing:.03em; }
.bl-table tr:last-child td { border-bottom:0; }
.bl-table .num { text-align:right; }
.bl-table tbody tr:hover { background:#f8fbff; }
.bl-table--mini { margin-top:6px; }
.bl-sort { text-decoration:none; color:inherit; }
.bl-sort:hover { color:var(--bl-blue); }
.bl-empty { color:var(--bl-muted); padding:14px 0; }
.bl-empty--callout { background:#fff8e6; border:1px dashed #e3c789; color:#8a5a00; padding:14px 16px; border-radius:9px; }
.bl-badge { font-size:12px; padding:3px 9px; border-radius:999px; background:#eef2f7; }
.bl-badge--ok { background:#e3f6ea; color:#1c7c43; }
.bl-badge--muted { background:#eef2f7; color:#647688; }
.bl-badge--lg { font-size:13px; padding:6px 12px; }

/* Pager */
.bl-pager { display:flex; justify-content:space-between; align-items:center; margin-top:16px; flex-wrap:wrap; gap:10px; }
.bl-pager__info { color:var(--bl-muted); font-size:13px; }
.bl-pager__links a { text-decoration:none; padding:6px 11px; border:1px solid var(--bl-line); border-radius:8px; margin-left:4px; color:var(--bl-ink); font-size:13px; }
.bl-pager__links a.is-active { background:var(--bl-blue); color:#fff; border-color:var(--bl-blue); }

/* Buttons / forms */
.bl-btn { padding:8px 14px; border:1px solid var(--bl-line); background:#fff; border-radius:8px; cursor:pointer; font-size:14px; }
.bl-btn--primary { background:var(--bl-blue); color:#fff; border-color:var(--bl-blue); width:100%; padding:11px; font-weight:600; }
.bl-link { color:var(--bl-blue); text-decoration:none; font-size:13.5px; }

/* Login */
.bl-login { min-height:100vh; display:flex; flex-direction:column; justify-content:center; align-items:center;
  background:linear-gradient(135deg,#13315c 0%,#1f6feb 55%,#39c0c8 120%); }
.bl-login__card { background:#fff; padding:34px; border-radius:16px; width:380px; max-width:92vw; box-shadow:0 24px 60px rgba(0,0,0,.28); }
.bl-login__brand { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.bl-login__brand span { display:block; color:var(--bl-muted); font-size:12px; }
.bl-hint { background:#eaf2ff; border:1px solid #cfe0ff; border-radius:10px; padding:12px 36px 12px 14px; font-size:13px; position:relative; margin-bottom:16px; }
.bl-hint code { background:#fff; padding:1px 6px; border-radius:5px; border:1px solid #cfe0ff; }
.bl-hint__close { position:absolute; right:8px; top:6px; border:0; background:none; font-size:18px; cursor:pointer; color:var(--bl-muted); }
.bl-error { background:#fde7e7; color:#9b1c1c; padding:10px 14px; border-radius:9px; font-size:13.5px; margin-bottom:14px; }
.bl-form label { display:block; font-size:13px; color:var(--bl-muted); margin-bottom:12px; }
.bl-form input[type=text], .bl-form input[type=password] { width:100%; padding:10px 12px; border:1px solid var(--bl-line); border-radius:9px; margin-top:5px; font-size:14px; }
.bl-form__row { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.bl-check { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--bl-ink); margin:0; }

/* Policy detail */
.bl-policy__head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:18px; }
.bl-chip { background:#eaf2ff; color:var(--bl-blue); font-size:12px; font-weight:600; padding:3px 10px; border-radius:999px; }
.bl-policy__num { color:var(--bl-muted); margin:6px 0 0; }
.bl-tabs { display:flex; gap:4px; border-bottom:2px solid var(--bl-line); margin-bottom:18px; }
.bl-tab { border:0; background:none; padding:11px 16px; cursor:pointer; font-size:14px; color:var(--bl-muted); border-bottom:2px solid transparent; margin-bottom:-2px; }
.bl-tab.is-active { color:var(--bl-blue); border-bottom-color:var(--bl-blue); font-weight:600; }
.bl-tabpanel { display:none; }
.bl-tabpanel.is-active { display:block; }
.bl-panelbox { background:#fff; border:1px solid var(--bl-line); border-radius:12px; padding:22px; }
.bl-dl { display:grid; grid-template-columns:200px 1fr; gap:0; margin:0; }
.bl-dl dt { color:var(--bl-muted); font-size:13px; padding:9px 0; border-bottom:1px solid #eef2f7; }
.bl-dl dd { margin:0; padding:9px 0; border-bottom:1px solid #eef2f7; font-size:14px; }
.bl-showmore { margin:16px 0; }
.bl-showmore summary { cursor:pointer; color:var(--bl-blue); font-size:13.5px; font-weight:600; }
.bl-docs { list-style:none; margin:0; padding:0; }
.bl-docs li { padding:11px 0; border-bottom:1px solid var(--bl-line); display:flex; justify-content:space-between; gap:12px; }
.bl-docs li:last-child { border-bottom:0; }

/* Client detail (client-rendered) */
.bl-skeleton { padding:8px 0; }
.bl-skel-line { height:16px; background:linear-gradient(90deg,#eef2f7,#e2e9f1,#eef2f7); border-radius:6px; margin:12px 0; animation:blshimmer 1.3s infinite; }
.bl-skel-line--lg { height:30px; width:40%; }
.bl-skel-card { height:120px; background:#eef2f7; border-radius:12px; margin:16px 0; animation:blshimmer 1.3s infinite; }
.bl-skel-note { color:var(--bl-muted); font-size:13px; }
@keyframes blshimmer { 0%{opacity:.6} 50%{opacity:1} 100%{opacity:.6} }
.bl-profile { background:#fff; border:1px solid var(--bl-line); border-radius:12px; padding:22px; margin-bottom:22px; display:flex; gap:24px; flex-wrap:wrap; }
.bl-profile__name { font-size:22px; margin:0 0 6px; }
.bl-profile__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px 24px; font-size:14px; flex:1; }
.bl-profile__grid .k { color:var(--bl-muted); font-size:12px; display:block; }
.bl-carrier { background:#fff; border:1px solid var(--bl-line); border-radius:12px; margin-bottom:14px; overflow:hidden; }
.bl-carrier__head { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; cursor:pointer; background:#f7fafd; }
.bl-carrier__head h3 { margin:0; font-size:15px; }
.bl-carrier__body { padding:8px 18px 16px; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; }
.bl-carrier.collapsed .bl-carrier__body { display:none; }
.bl-pcard { border:1px solid var(--bl-line); border-radius:10px; padding:14px; }
.bl-pcard a { font-weight:600; text-decoration:none; }
.bl-pcard__row { display:flex; justify-content:space-between; font-size:13px; padding:3px 0; color:var(--bl-ink); }
.bl-pcard__row .k { color:var(--bl-muted); }

/* Footer */
.bl-footer { margin-top:40px; }
.bl-footer__inner { max-width:1160px; margin:0 auto; padding:18px 24px; display:flex; justify-content:space-between; color:var(--bl-muted); font-size:13px; }
.bl-footer__home { text-decoration:none; }
.demo-banner { background:#2a1a00; color:#ffd479; text-align:center; padding:9px; font-size:12px; font-weight:600; letter-spacing:.4px; }
.demo-banner--login { position:fixed; bottom:0; left:0; right:0; }
