/* roulang page: index */
:root {
            --color-primary: #1E40AF;
            --color-primary-dark: #1E3A8A;
            --color-accent: #0284C7;
            --bg-page: #F8FAFC;
            --bg-card: #FFFFFF;
            --text-main: #0F172A;
            --text-muted: #475569;
            --border-light: #E2E8F0;
            --radius-card: 1rem;
            --radius-button: 0.5rem;
            --shadow-subtle: 0 4px 20px -4px rgba(15, 23, 42, 0.05);
            --shadow-hover: 0 16px 32px -8px rgba(30, 64, 175, 0.12);
        }
        html {
            scroll-behavior: smooth;
        }
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
            background-color: var(--bg-page);
            color: var(--text-main);
            overflow-x: hidden;
        }
        .ui-card {
            background: var(--bg-card);
            border: 1px solid var(--border-light);
            box-shadow: var(--shadow-subtle);
            border-radius: var(--radius-card);
            transition: all 0.25s ease-in-out;
        }
        .ui-card:hover {
            box-shadow: var(--shadow-hover);
            transform: translateY(-3px);
            border-color: #CBD5E1;
        }
        details summary::-webkit-details-marker {
            display: none;
        }