.chess-theme {
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    
    --color-empty: #ffffff;
    --color-empty-contrast: #111111;
    --color-empty-hover: color-mix(in srgb, var(--color-empty) 60%, black);
    

    /* Primary - light squares */
    --color-primary: #111111;
    --color-primary-contrast: #fff;
    --color-primary-hover: color-mix(in srgb, var(--color-primary) 30%, white);

    /* Secondary - dark squares */
    --color-secondary: var(--color-primary);
    --color-secondary-contrast: var(--color-primary-contrast);
    --color-secondary-hover: color-mix(in srgb, var(--color-secondary) 30%, white);

    /* Tertiary - accent highlight */
    --color-tertiary: var(--color-primary);
    --color-tertiary-contrast: var(--color-primary-contrast);
    --color-tertiary-hover: color-mix(in srgb, var(--color-tertiary) 25%, white);


    /* Additional Colors */
    --color-additional: var(--color-primary);
    --color-additional-contrast: var(--color-primary-contrast);
    --color-additional-hover: color-mix(in srgb, var(--color-additional) 25%, white);

    /* Utility Colors */
    --color-info: var(--color-primary);
    --color-info-contrast: var(--color-primary-contrast);
    --color-info-hover: color-mix(in srgb, var(--color-info) 20%, white);

    --color-success: var(--color-primary);
    --color-success-contrast: var(--color-primary-contrast);
    --color-success-hover: color-mix(in srgb, var(--color-success) 20%, white);

    --color-warning: var(--color-primary);
    --color-warning-contrast: var(--color-primary-contrast);
    --color-warning-hover: color-mix(in srgb, var(--color-warning) 20%, white);

    --color-error: var(--color-primary);
    --color-error-contrast: var(--color-primary-contrast);
    --color-error-hover: color-mix(in srgb, var(--color-error) 20%, white);

    /* Surface colors */
    --surface: #e5e6ea;
    --surface-light: #ffffff;
    --surface-dark: var(--surface);

    /* Wrapped */
    --app-background-size: 50px 50px;
    --app-background-position: 0 0, 25px 25px, 25px 0, 0 25px;
    --app-background-image:
        linear-gradient(45deg, #000 25%, transparent 25%,
            transparent 75%, #000 75%, #000),
        linear-gradient(45deg, #000 25%, transparent 25%,
            transparent 75%, #000 75%, #000),
        linear-gradient(45deg, #fff 25%, transparent 25%,
            transparent 75%, #fff 75%, #fff),
        linear-gradient(45deg, #fff 25%, transparent 25%,
            transparent 75%, #fff 75%, #fff);
    --app-background-color: var(--surface);

    --paper-background-size: auto;
    --paper-background-position: auto;
    --paper-background-image: none;
    --paper-background-color: var(--surface);

    --paper-border-top-left-radius: none;
    --paper-border-top-right-radius: none;
    --paper-border-bottom-left-radius: none;
    --paper-border-bottom-right-radius: none;

    --paper-border-style: none;
    --paper-border-color: none;

    --app-bars-background-size: none;
    --app-bars-background-position: none;
    --app-bars-background-image: none;
    --app-bars-background-color: var(--surface-dark);
}