html, body { overflow-x: hidden; }
        body {
            background: #0a0a0a;
            color: #e5e7eb;
            font-family: Inter, sans-serif;
        }
        .card {
            background: #111111;
            border: 1px solid rgba(255,255,255,0.06);
            box-shadow: 0 10px 30px rgba(0,0,0,0.22);
            min-width: 0;
        }
        .card-label {
            color: rgb(156 163 175);
            font-size: .875rem;
            line-height: 1.25rem;
        }
        .muted {
            color: #9ca3af;
        }
        .value {
            color: #f3f4f6;
            word-break: break-word;
        }
        .hero-glow {
            background:
                radial-gradient(circle at top center, rgba(59,130,246,.14), transparent 40%),
                radial-gradient(circle at bottom right, rgba(34,197,94,.08), transparent 30%);
        }
        .status-dot {
            width: 10px;
            height: 10px;
            border-radius: 999px;
            flex: 0 0 auto;
        }
        .status-ok { background: #22c55e; }
        .status-warn { background: #f59e0b; }
        .status-neutral { background: #6b7280; }
        .info-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: .85rem 1rem;
        }
        @media (min-width: 640px) {
            .info-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }
        .info-row {
            border: 1px solid rgba(255,255,255,.06);
            background: rgba(255,255,255,.02);
            border-radius: .9rem;
            padding: .9rem 1rem;
        }
        .cta-btn {
            transition: transform .2s ease, opacity .2s ease, background-color .2s ease;
        }
        .cta-btn:hover {
            transform: translateY(-2px);
            opacity: .96;
        }
        .mono {
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        }