/* CSS Reset and Normalize */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    line-height: 1.5;
    color: #333;
    background: #fff;
}
        /* Chrome/macOS text-rendering fixes: improve antialiasing and avoid rasterizing text */
        :root, html, body, input, textarea, button {
            -webkit-font-smoothing: antialiased !important;
            -moz-osx-font-smoothing: grayscale !important;
            text-rendering: optimizeLegibility !important;
            -webkit-text-size-adjust: 100% !important;
        }
        /* Try to avoid forcing compositing layers for text-heavy interactive cards */
        .method-card, .tool-card, .prompt-item, .value-item, .feature-item, .action-button, .auth-button, .site-item, .sidebar {
            will-change: auto !important;
            backface-visibility: hidden !important;
            -webkit-backface-visibility: hidden !important;
        }
        /* Enable will-change only during hover/active for interactive cards to avoid persistent layer promotion */
        .method-card:hover, .tool-card:hover, .value-item:hover, .feature-item:hover, .action-button:hover, .auth-button:hover {
            will-change: transform;
        }
        /* Reduce backdrop-filter where it causes rasterization in some browsers */
        .usage-guide, .value-item, .prompt-item, .copy-success, .sidebar {
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
            background-color: rgba(255,255,255,0.94) !important;
        }