Dashboard
⚡ FDIC LIVE
Connecting to FDIC...
banks.data.fdic.gov
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}} @keyframes countUp{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}} @keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}} .logo-name{font-family:var(--display);font-size:18px;font-weight:700;color:var(--t0);letter-spacing:-0.3px;line-height:1.1} .logo-sub{font-size:10px;color:var(--t3);margin-top:3px;letter-spacing:.3px} .api-bar{padding:10px 16px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:5px} .api-row{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--t3)} .api-dot{width:5px;height:5px;border-radius:50%;background:var(--t3);flex-shrink:0} .api-dot.live{background:var(--green);box-shadow:0 0 6px var(--green);animation:pulse 2s infinite} .api-dot.loading{background:var(--amber);animation:pulse 1s infinite} .api-dot.error{background:var(--red)} .nav-section{padding:14px 0 4px} .nav-label{font-size:8px;color:var(--t3);letter-spacing:1.5px;text-transform:uppercase;padding:0 20px 6px;font-family:var(--mono)} .nav-item{display:flex;align-items:center;gap:10px;padding:9px 20px;cursor:pointer;font-size:12px;color:var(--t2);border-left:2px solid transparent;transition:all 0.15s;position:relative} .nav-item:hover{color:var(--t1);background:var(--surface)} .nav-item.active{color:var(--green);border-left-color:var(--green);background:var(--green-glow);font-weight:500} .nav-icon{font-size:14px;flex-shrink:0;opacity:.7} .nav-item.active .nav-icon{opacity:1} .nav-count{margin-left:auto;font-family:var(--mono);font-size:9px;background:var(--surface2);padding:1px 6px;border-radius:10px;color:var(--t3)} .nav-item.active .nav-count{background:var(--green-glow);color:var(--green)} .sidebar-footer{margin-top:auto;padding:12px 16px;border-top:1px solid var(--border)} /* MAIN */ .main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0} .topbar{background:rgba(10,15,26,0.6);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:0 24px;height:54px;display:flex;align-items:center;gap:14px;flex-shrink:0} .topbar-title{font-family:var(--display);font-size:15px;font-weight:600;color:var(--t0)} .topbar-pill{display:inline-flex;align-items:center;gap:5px;font-size:9px;font-family:var(--mono);color:var(--green);background:var(--green-glow);border:1px solid rgba(0,229,160,0.2);padding:3px 9px;border-radius:20px;letter-spacing:.3px} .topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px} .btn{padding:6px 14px;border-radius:8px;border:1px solid var(--border2);background:var(--surface);color:var(--t1);font-size:11px;cursor:pointer;font-family:var(--sans);transition:all 0.15s;display:inline-flex;align-items:center;gap:5px;text-decoration:none} .btn:hover{background:var(--surface2);color:var(--t0);border-color:rgba(255,255,255,0.2)} .btn-green{background:var(--green-glow);border-color:rgba(0,229,160,0.25);color:var(--green)} .btn-green:hover{background:rgba(0,229,160,0.2)} .btn-sm{padding:4px 10px;font-size:10px} .content{flex:1;overflow-y:auto;padding:0} .content::-webkit-scrollbar{width:3px} .content::-webkit-scrollbar-thumb{background:var(--border2)} /* ── DASHBOARD ─────────────────────────────────────── */ .dash{padding:20px 24px;display:flex;flex-direction:column;gap:18px;animation:fadeUp 0.4s ease} /* Hero row */ .dash-hero{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;gap:10px} .hero-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px 18px;position:relative;overflow:hidden;transition:all 0.2s;cursor:default} .hero-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.09),transparent)} .hero-card:hover{border-color:var(--border2);background:var(--surface2);transform:translateY(-2px);box-shadow:0 8px 30px rgba(0,0,0,0.3)} .hero-card.glow-green{border-color:rgba(0,229,160,0.15);box-shadow:0 0 30px rgba(0,229,160,0.04)} .hero-card.glow-red{border-color:rgba(255,92,106,0.18);box-shadow:0 0 30px rgba(255,92,106,0.05)} .hero-card.glow-amber{border-color:rgba(255,181,71,0.18);box-shadow:0 0 30px rgba(255,181,71,0.05)} .hero-label{font-size:9px;color:var(--t3);letter-spacing:1.2px;text-transform:uppercase;font-family:var(--mono);margin-bottom:8px} .hero-val{font-family:var(--display);font-size:30px;font-weight:800;line-height:1;color:var(--t0)} .hero-val.green{color:var(--green);text-shadow:0 0 20px rgba(0,229,160,0.3)} .hero-val.amber{color:var(--amber);text-shadow:0 0 20px rgba(255,181,71,0.3)} .hero-val.red{color:var(--red);text-shadow:0 0 20px rgba(255,92,106,0.3)} .hero-val.blue{color:var(--blue);text-shadow:0 0 20px rgba(77,143,255,0.3)} .hero-val.purple{color:var(--purple)} .hero-sub{font-size:10px;color:var(--t3);margin-top:5px;line-height:1.4} .hero-trend{position:absolute;top:14px;right:14px;font-size:9px;font-family:var(--mono);padding:2px 7px;border-radius:10px} .trend-up{background:rgba(0,229,160,0.12);color:var(--green)} .trend-down{background:rgba(255,92,106,0.12);color:var(--red)} .trend-flat{background:var(--surface2);color:var(--t2)} /* Mid row — 2 col */ .dash-mid{display:grid;grid-template-columns:1fr 1fr;gap:14px} /* Panel card */ .panel{background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden} .panel-header{padding:14px 18px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between} .panel-title{font-family:var(--display);font-size:13px;font-weight:600;color:var(--t1);display:flex;align-items:center;gap:8px} .panel-title::before{content:'';display:inline-block;width:3px;height:13px;background:var(--green);border-radius:2px;box-shadow:0 0 6px var(--green)} .panel-body{padding:0} .panel-footer{padding:10px 18px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between} .panel-count{font-family:var(--mono);font-size:10px;color:var(--t3)} /* Rating Distribution */ .rating-bars{padding:16px 18px;display:flex;flex-direction:column;gap:10px} .rating-row{display:flex;align-items:center;gap:10px} .rating-label{font-size:10px;color:var(--t1);width:150px;flex-shrink:0} .rating-track{flex:1;height:6px;background:rgba(255,255,255,0.05);border-radius:4px;overflow:hidden} .rating-fill{height:6px;border-radius:4px;transition:width 1s cubic-bezier(0.4,0,0.2,1)} .rf-outstanding{background:linear-gradient(90deg,var(--green),#00b87d)} .rf-satisfactory{background:linear-gradient(90deg,var(--blue),#3a6fd0)} .rf-needs{background:linear-gradient(90deg,var(--amber),#e0952a)} .rf-substantial{background:linear-gradient(90deg,var(--red),#d04050)} .rf-unknown{background:rgba(255,255,255,0.1)} .rating-count{font-family:var(--mono);font-size:10px;color:var(--t2);width:28px;text-align:right;flex-shrink:0} /* At-risk list */ .risk-list{display:flex;flex-direction:column} .risk-item{padding:11px 18px;border-bottom:1px solid rgba(255,255,255,0.04);display:flex;align-items:center;gap:12px;cursor:pointer;transition:background 0.1s} .risk-item:hover{background:var(--surface2)} .risk-item:last-child{border-bottom:none} .risk-sev{width:4px;height:36px;border-radius:2px;flex-shrink:0} .sev-critical{background:var(--red);box-shadow:0 0 8px rgba(255,92,106,0.4)} .sev-high{background:var(--amber);box-shadow:0 0 8px rgba(255,181,71,0.3)} .sev-watch{background:var(--blue)} .risk-name{font-size:12px;font-weight:500;color:var(--t0);margin-bottom:2px} .risk-detail{font-size:10px;color:var(--t2);line-height:1.4} .risk-badge{margin-left:auto;flex-shrink:0} /* Exam timeline */ .timeline-grid{padding:14px 18px;display:grid;grid-template-columns:1fr 1fr;gap:8px} .quarter-card{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;transition:all 0.15s} .quarter-card:hover{border-color:var(--border2);background:var(--surface3)} .quarter-label{font-family:var(--mono);font-size:9px;color:var(--t3);letter-spacing:.8px;margin-bottom:4px} .quarter-count{font-family:var(--display);font-size:20px;font-weight:700;color:var(--t0)} .quarter-sub{font-size:9px;color:var(--t3);margin-top:2px} .quarter-card.urgent{border-color:rgba(255,92,106,0.2);background:rgba(255,92,106,0.04)} .quarter-card.urgent .quarter-count{color:var(--red)} /* Bottom row — 3 col */ .dash-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px} /* Asset breakdown */ .asset-donut{display:flex;align-items:center;gap:16px;padding:16px 18px} .donut-svg{flex-shrink:0} .donut-legend{flex:1;display:flex;flex-direction:column;gap:7px} .legend-row{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--t1)} .legend-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0} .legend-val{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--t2)} /* Fair lending flags */ .flag-list{padding:0} .flag-item{padding:10px 18px;border-bottom:1px solid rgba(255,255,255,0.04);display:flex;align-items:center;gap:10px;font-size:11px} .flag-item:last-child{border-bottom:none} .flag-icon{font-size:14px;flex-shrink:0} .flag-name{color:var(--t0);font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .flag-val{font-family:var(--mono);font-size:10px;color:var(--amber);flex-shrink:0} /* Quick search */ .quick-search{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px 18px} .qs-label{font-size:9px;color:var(--t3);letter-spacing:1px;text-transform:uppercase;font-family:var(--mono);margin-bottom:10px} .qs-input-wrap{position:relative;margin-bottom:10px} .qs-input{width:100%;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:9px 12px 9px 34px;color:var(--t0);font-size:12px;font-family:var(--sans);outline:none;transition:all 0.15s} .qs-input:focus{border-color:rgba(0,229,160,0.3);background:var(--surface3);box-shadow:0 0 0 3px rgba(0,229,160,0.06)} .qs-input::placeholder{color:var(--t3)} .qs-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:14px;color:var(--t3)} .qs-results{display:flex;flex-direction:column;gap:0;max-height:180px;overflow-y:auto} .qs-results::-webkit-scrollbar{width:3px} .qs-results::-webkit-scrollbar-thumb{background:var(--border2)} .qs-result{padding:8px 0;border-bottom:1px solid rgba(255,255,255,0.04);cursor:pointer;transition:all 0.1s;display:flex;align-items:center;gap:8px} .qs-result:hover .qs-result-name{color:var(--green)} .qs-result:last-child{border-bottom:none} .qs-result-name{font-size:11px;color:var(--t1);font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .qs-result-meta{font-size:9px;color:var(--t3);font-family:var(--mono);flex-shrink:0} .qs-empty{font-size:11px;color:var(--t3);text-align:center;padding:16px 0} /* Skeleton loading */ .skeleton{background:linear-gradient(90deg,var(--surface) 25%,var(--surface2) 50%,var(--surface) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px} /* ── BANKS TABLE VIEW ─────────────────────────────── */ .banks-view{padding:20px 24px;display:flex;flex-direction:column;gap:14px;animation:fadeUp 0.3s ease} .metrics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:4px} .metric-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 16px;position:relative;overflow:hidden;transition:all 0.2s} .metric-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent)} .metric-card:hover{border-color:var(--border2);background:var(--surface2);transform:translateY(-1px)} .metric-label{font-size:9px;color:var(--t3);letter-spacing:1px;text-transform:uppercase;font-family:var(--mono);margin-bottom:7px} .metric-val{font-family:var(--display);font-size:26px;font-weight:700;line-height:1;color:var(--t0)} .metric-val.green{color:var(--green)}.metric-val.amber{color:var(--amber)}.metric-val.red{color:var(--red)}.metric-val.blue{color:var(--blue)}.metric-val.purple{color:var(--purple)} .metric-sub{font-size:10px;color:var(--t3);margin-top:4px} .sec-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px} .sec-title{font-family:var(--display);font-size:13px;font-weight:600;color:var(--t1);display:flex;align-items:center;gap:8px} .sec-title::before{content:'';display:inline-block;width:3px;height:14px;background:var(--green);border-radius:2px;box-shadow:0 0 8px var(--green)} .filter-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center} .chip{padding:5px 12px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--t2);font-size:10px;cursor:pointer;font-family:var(--sans);transition:all 0.12s;white-space:nowrap} .chip:hover{background:var(--surface2);color:var(--t1);border-color:var(--border2)} .chip.active{background:var(--green-glow);color:var(--green);border-color:rgba(0,229,160,0.25)} .search-wrap{position:relative} .search-input{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:7px 12px 7px 32px;color:var(--t0);font-size:12px;font-family:var(--sans);outline:none;width:220px;transition:all 0.15s} .search-input:focus{border-color:rgba(0,229,160,0.3);background:var(--surface2);box-shadow:0 0 0 3px rgba(0,229,160,0.06)} .search-input::placeholder{color:var(--t3)} .search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--t3);pointer-events:none} .table-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden} .table-bar{padding:10px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:rgba(255,255,255,0.02)} .table-count{font-family:var(--mono);font-size:10px;color:var(--t3)} .table-hint{font-size:10px;color:var(--t3)} .table-scroll{overflow-x:auto;max-height:calc(100vh - 310px)} .table-scroll::-webkit-scrollbar{width:3px;height:3px} .table-scroll::-webkit-scrollbar-thumb{background:var(--border2)} table{width:100%;border-collapse:collapse;font-size:12px} thead{position:sticky;top:0;z-index:5} thead tr{background:rgba(10,15,26,0.98);backdrop-filter:blur(10px);border-bottom:1px solid var(--border2)} th{padding:10px 14px;text-align:left;font-weight:500;color:var(--t2);font-size:9px;letter-spacing:1px;text-transform:uppercase;font-family:var(--mono);white-space:nowrap;cursor:pointer;user-select:none;transition:color 0.1s} th:hover{color:var(--t1)} td{padding:11px 14px;border-bottom:1px solid rgba(255,255,255,0.04);vertical-align:middle;white-space:nowrap} tbody tr{cursor:pointer;transition:background 0.1s} tbody tr:hover td{background:rgba(255,255,255,0.03)} tbody tr:last-child td{border-bottom:none} tbody tr.expanded td{background:rgba(0,229,160,0.03)} .badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:6px;font-size:9px;font-weight:500;letter-spacing:.3px;white-space:nowrap} .b-outstanding{background:rgba(0,229,160,0.12);color:#00e5a0;border:1px solid rgba(0,229,160,0.2)} .b-satisfactory{background:rgba(77,143,255,0.12);color:#4d8fff;border:1px solid rgba(77,143,255,0.2)} .b-needs{background:rgba(255,181,71,0.12);color:#ffb547;border:1px solid rgba(255,181,71,0.2)} .b-substantial{background:rgba(255,92,106,0.12);color:#ff5c6a;border:1px solid rgba(255,92,106,0.2)} .b-unknown{background:var(--surface2);color:var(--t2);border:1px solid var(--border)} .b-occ{background:rgba(77,143,255,0.1);color:#4d8fff;border:1px solid rgba(77,143,255,0.2)} .b-fed{background:rgba(167,139,255,0.1);color:#a78bff;border:1px solid rgba(167,139,255,0.2)} .b-fdic{background:rgba(255,181,71,0.1);color:#ffb547;border:1px solid rgba(255,181,71,0.2)} .b-large{background:rgba(167,139,255,0.1);color:#a78bff;border:1px solid rgba(167,139,255,0.2)} .b-intermediate{background:rgba(77,143,255,0.1);color:#4d8fff;border:1px solid rgba(77,143,255,0.2)} .b-small{background:rgba(0,229,160,0.1);color:#00e5a0;border:1px solid rgba(0,229,160,0.2)} .mono{font-family:var(--mono);font-size:10px} .lei-text{font-family:var(--mono);font-size:9px;color:var(--purple);letter-spacing:.2px} .cert-text{font-family:var(--mono);font-size:10px;color:var(--blue)} .drawer-row td{padding:0!important} .drawer-body{background:rgba(0,229,160,0.02);border-top:1px solid rgba(0,229,160,0.1);padding:16px 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;animation:fadeUp 0.2s ease} .drawer-stat{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:10px 12px} .drawer-stat-label{font-size:8px;color:var(--t3);text-transform:uppercase;letter-spacing:.8px;font-family:var(--mono);margin-bottom:4px} .drawer-stat-val{font-family:var(--display);font-size:14px;font-weight:600;color:var(--t0)} .drawer-full{grid-column:1/-1;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:10px 12px} .drawer-full-label{font-size:8px;color:var(--t3);text-transform:uppercase;letter-spacing:.8px;font-family:var(--mono);margin-bottom:5px} .drawer-tags{display:flex;gap:5px;flex-wrap:wrap} .drawer-action-row{grid-column:1/-1;display:flex;gap:8px;margin-top:4px} /* LOADING */ .loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:16px} .loading-orb{width:48px;height:48px;border-radius:50%;border:2px solid rgba(0,229,160,0.2);border-top-color:var(--green);animation:spin 1s linear infinite;box-shadow:0 0 20px rgba(0,229,160,0.15)} .loading-text{font-family:var(--mono);font-size:12px;color:var(--t2)} .loading-source{font-size:10px;color:var(--t3);letter-spacing:.5px} .load-progress{width:200px;height:2px;background:var(--surface2);border-radius:2px;overflow:hidden} .load-progress-fill{height:2px;background:var(--green);border-radius:2px;box-shadow:0 0 8px var(--green);animation:shimmer 1.5s infinite} .error-card{background:rgba(255,92,106,0.06);border:1px solid rgba(255,92,106,0.2);border-radius:16px;padding:24px;max-width:480px;margin:40px auto} .error-title{font-family:var(--display);font-size:16px;font-weight:600;color:var(--red);margin-bottom:8px} .error-desc{font-size:12px;color:rgba(255,92,106,0.7);line-height:1.6;margin-bottom:10px} .error-code{font-family:var(--mono);font-size:10px;color:rgba(255,92,106,0.5);background:rgba(255,92,106,0.05);border:1px solid rgba(255,92,106,0.15);border-radius:6px;padding:8px 10px;word-break:break-all} .empty{text-align:center;padding:48px;color:var(--t3);font-size:12px} .coming-soon{display:flex;flex-direction:column;align-items:center;justify-content:center;height:55vh;gap:12px} .coming-soon-icon{font-size:40px;opacity:.15} .coming-soon-title{font-family:var(--display);font-size:16px;font-weight:600;color:var(--t2)} .coming-soon-desc{font-size:12px;color:var(--t3);text-align:center;max-width:320px;line-height:1.7} .coming-soon-module{font-family:var(--mono);color:var(--green)} /* HAMBURGER */ .hamburger{display:none;background:none;border:none;cursor:pointer;padding:4px;color:var(--t1);font-size:20px;line-height:1} .sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.6);backdrop-filter:blur(4px);z-index:99} /* RESPONSIVE */ @media(max-width:900px){ .dash-hero{grid-template-columns:repeat(3,1fr)} .dash-mid{grid-template-columns:1fr} .dash-bottom{grid-template-columns:1fr} } @media(max-width:768px){ .sidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);z-index:100} .sidebar.open{transform:translateX(0)} .sidebar-overlay.open{display:block} .hamburger{display:flex} .topbar{padding:0 16px;height:52px} .dash,.banks-view{padding:14px 16px} .dash-hero{grid-template-columns:repeat(2,1fr);gap:8px} .dash-mid{grid-template-columns:1fr;gap:10px} .dash-bottom{grid-template-columns:1fr;gap:10px} .metrics-grid{grid-template-columns:repeat(2,1fr);gap:8px} .search-input{width:150px} .table-scroll{max-height:calc(100vh - 280px)} th:nth-child(n+7){display:none} td:nth-child(n+7){display:none} } @media(max-width:480px){ .dash-hero{grid-template-columns:1fr 1fr} .hero-val{font-size:24px} th:nth-child(n+5){display:none} td:nth-child(n+5){display:none} }
Dashboard
⚡ FDIC LIVE
Connecting to FDIC...
banks.data.fdic.gov