/* roulang page: index */
:root {
            --brand-primary: #059669;
            --brand-light: #10b981;
            --accent-amber: #f59e0b;
            --obsidian-dark: #020617;
            --surface-card: #ffffff;
            --text-main: #0f172a;
            --text-muted: #64748b;
        }

        body {
            font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', system-ui, sans-serif;
            background-color: #f8fafc;
            color: var(--text-main);
            overflow-x: hidden;
        }

        /* 统一平滑阴影与卡片微互动 */
        .tech-card {
            background: #ffffff;
            border: 1px solid #e2e8f0;
            border-radius: 0.75rem;
            transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.25s ease;
        }
        .tech-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 16px 30px -8px rgba(5, 150, 105, 0.12), 0 4px 10px -2px rgba(15, 23, 42, 0.05);
            border-color: #a7f3d0;
        }

        .tech-card-dark {
            background: #0b1329;
            border: 1px solid #1e293b;
            border-radius: 0.75rem;
            transition: all 0.25s ease;
        }
        .tech-card-dark:hover {
            border-color: #10b981;
            box-shadow: 0 10px 25px -5px rgba(16, 185, 129, 0.15);
        }

        /* 状态与指示灯脉冲 */
        .pulse-indicator {
            position: relative;
            display: inline-block;
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background-color: #10b981;
        }
        .pulse-indicator::after {
            content: '';
            position: absolute;
            top: -4px;
            left: -4px;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            background-color: rgba(16, 185, 129, 0.4);
            animation: pulse-ring 2s infinite ease-out;
        }
        @keyframes pulse-ring {
            0% { transform: scale(0.5); opacity: 1; }
            100% { transform: scale(1.8); opacity: 0; }
        }

        /* 表单输入轮廓聚焦 */
        input:focus, select:focus, textarea:focus {
            outline: none;
            border-color: #059669;
            box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.18);
        }

        /* 隐藏原生滚动条并提供极简滑轨 */
        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }
        ::-webkit-scrollbar-track {
            background: #f1f5f9;
        }
        ::-webkit-scrollbar-thumb {
            background: #cbd5e1;
            border-radius: 4px;
        }
        ::-webkit-scrollbar-thumb:hover {
            background: #94a3b8;
        }