/* WEB PANEL PROXY public CSS */
:root {
            --bg-body: #0d1117;
            --card-bg: #161b22;
            --card-border: #30363d;
            --text-main: #f0f6fc;
            --text-muted: #8b949e;
            --accent: #58a6ff;
            --accent-glow: rgba(88, 166, 255, 0.15);
            --stroke-color: #8b949e;
            --fill-subtle: #21262d;
        }

        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        body {
            font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
            background-color: var(--bg-body);
            color: var(--text-main);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
        }

        .card {
            background-color: var(--card-bg);
            border: 1px solid var(--card-border);
            border-radius: 24px;
            max-width: 860px;
            width: 100%;
            padding: 56px 48px 40px;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
            display: flex;
            flex-direction: column;
            position: relative;
            overflow: hidden;
        }

        .illustration-top {
            width: 90px;
            height: 90px;
            margin-bottom: 32px;
        }

        .content {
            margin-bottom: 48px;
            max-width: 620px;
        }

        .title {
            font-family: 'Space Grotesk', sans-serif;
            font-size: clamp(28px, 4vw, 42px);
            font-weight: 700;
            line-height: 1.25;
            letter-spacing: -0.02em;
            color: var(--text-main);
        }

        .tg-link {
            color: var(--accent);
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-underline-offset: 6px;
            transition: all 0.2s ease;
            display: inline-block;
        }

        .tg-link:hover {
            color: #79b8ff;
            text-shadow: 0 0 12px var(--accent-glow);
            text-underline-offset: 8px;
        }

        .bottom-row {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 20px;
        }

        .footer-note {
            color: var(--text-muted);
            font-size: 14px;
            font-weight: 400;
            line-height: 1.5;
        }

        .illustration-bottom {
            width: 100px;
            height: 100px;
            flex-shrink: 0;
        }

        /* SVG Styles */
        .svg-stroke {
            stroke: var(--stroke-color);
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
            fill: none;
        }

        .svg-fill-subtle {
            fill: var(--fill-subtle);
        }

        .svg-accent {
            stroke: var(--accent);
            fill: var(--accent-glow);
        }

        @media (max-width: 600px) {
            .card {
                padding: 32px 24px 28px;
            }
            .bottom-row {
                flex-direction: column-reverse;
                align-items: flex-start;
                gap: 24px;
            }
            .illustration-bottom {
                align-self: flex-end;
            }
        }