*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,sans-serif;background:#f4f6fb;color:#1f2937}.app{max-width:1200px;margin:0 auto;padding:32px 24px 48px}.header{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}.brand{display:flex;align-items:center;gap:12px}.logos{display:flex;align-items:center;gap:14px;padding:8px 14px;border-radius:14px;background:#fff;box-shadow:0 8px 18px #0f172a14;width:fit-content}.logos img{height:38px;width:auto;display:block}.divider{width:1px;height:28px;background:#e5e7eb}.brand-text{display:flex;flex-direction:column;gap:4px}.header-actions{display:flex;align-items:center;gap:12px}.header h1{font-size:28px;margin-bottom:6px}.header p{color:#6b7280}.status{padding:8px 16px;border-radius:999px;font-weight:600;font-size:14px}.action-button{border:none;background:#0f172a;color:#fff;padding:10px 18px;border-radius:999px;font-weight:600;font-size:14px;cursor:pointer;transition:background .2s ease,transform .2s ease}.action-button:hover{background:#1f2937;transform:translateY(-1px)}.status.conectado{background:#dcfce7;color:#166534}.status.conectando{background:#e0f2fe;color:#0c4a6e}.status.erro{background:#fee2e2;color:#991b1b}.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:24px}.summary-card{background:#fff;padding:16px;border-radius:16px;box-shadow:0 10px 20px #0f172a14;display:flex;flex-direction:column;gap:8px}.summary-card span{color:#6b7280;font-size:14px}.summary-card strong{font-size:22px}.content{background:#fff;padding:16px;border-radius:16px;box-shadow:0 10px 20px #0f172a14}table{width:100%;border-collapse:collapse;font-size:14px}thead{background:#f8fafc;text-align:left}th,td{padding:12px 10px;border-bottom:1px solid #e5e7eb}tbody tr:hover{background:#f9fafb}.value{font-weight:600;color:#111827}.value-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:#111827;color:#fff;font-weight:600;min-width:140px;justify-content:center}@media (max-width: 768px){.app{padding:20px 16px 36px}.header,.brand{flex-direction:column;align-items:flex-start}.header-actions{width:100%;justify-content:space-between}.logos{padding:6px 10px;gap:10px}.logos img{height:32px}.header h1{font-size:20px}table{font-size:13px}th,td{padding:10px 8px}}
