:root {
    --color-page: #ffffff;
    --color-panel-surface: #dde2e7;
    --color-panel-header-surface: #dfe4ea;
    --color-panel-body-surface: #e9ebed;
    --color-card-surface: #cfcfcf;
    --color-control-surface: #eef2f4;
    --color-control-pressed: #ffffff;
    --color-text: #000000;
    --color-heading: #2a4d67;
    --color-divider: rgba(0, 0, 0, 0.12);
    --color-divider-highlight: rgba(255, 255, 255, 0.3);
    --color-input-border: #ffffff;
    --color-button-border: #ffffff;
    --color-notification-surface: rgba(255, 255, 255, 0.5);
    --color-notification-error: rgba(255, 179, 179, 0.5);
    --color-notification-success: rgba(198, 247, 198, 0.5);
    --color-notification-warning: rgba(255, 235, 153, 0.5);
    --color-notification-info: rgba(179, 217, 255, 0.5);
    --shadow-heading: rgba(26, 37, 49, 0.18);
    --header-divider-width: 4px;
    --header-padding-bottom: 8px;
    --color-panel: #eeeeee;
    --color-panel-header: #eeeeee;
    --color-card: #dddddd;
    --color-control: #eeeeee;
    --color-border: #ffffff;
    --color-border-strong: #000000;
    --color-muted: #333333;
    --color-subtitle: #222222;
    --color-icon-text: #000000;
    --color-icon-border: rgba(0, 0, 0, 0.15);
    --color-common: #3b3b3b;
    --color-rare: #8a5a00;
    --color-epic: #007c83;
    --color-legendary: #9b267f;
    --color-secret: #b42318;
    --color-points: #8a5a00;
    --color-points-border: rgba(138, 90, 0, 0.35);
    --color-rarity-common-border: rgba(0, 0, 0, 0.22);
    --color-rarity-rare-border: rgba(138, 90, 0, 0.75);
    --color-rarity-epic-border: rgba(0, 124, 131, 0.75);
    --color-rarity-legendary-border: rgba(155, 38, 127, 0.8);
    --color-rarity-secret-border: rgba(180, 35, 24, 0.8);
    --color-card-hover: #7a7a7a;
    --color-white: #ffffff;
    --color-score-surface: #eef2f4;
    --color-shadow: rgba(26, 37, 49, 0.18);
    --color-inset: rgba(0, 0, 0, 0.05);
    --color-score-inset: rgba(0, 0, 0, 0.08);
    --font-family: "capsmall";
    --title-font: "lowbig";
    --page-padding: 10px;
    --page-width: 960px;
    --page-gap: 8px;
    --tip-area-height: clamp(96px, 22vh, 220px);
    --sidebar-min-width: 280px;
    --sidebar-max-width: 400px;
    --panel-header-padding: 10px 12px 8px;
    --panel-header-gap: 12px;
    --panel-divider-width: 4px;
    --panel-title-size: clamp(1.5rem, 2.2vw, 2.8rem);
    --account-title-size: clamp(1.05rem, 1.5vw, 1.6rem);
    --account-title-padding-bottom: 8px;
    --panel-body-padding: 8px 10px 10px;
    --card-gap: 6px;
    --card-radius: 0;
    --card-border-width: 4px;
    --font-multiplier: 1.2;
    --achievement-border-width: 4px;
    --achievement-min-width: 220px;
    --achievement-columns: 4;
    --achievement-columns-medium: 2;
    --achievement-inner-padding: 8px;
    --achievement-inner-gap: 6px;
    --achievement-icon-size: 44px;
    --achievement-title-bottom: 4px;
    --achievement-description-bottom: 8px;
    --achievement-description-min-height: 34px;
    --achievement-meta-gap: 10px;
    --achievement-status-size: 32px;
    --milestone-min-width: 160px;
    --milestone-padding: 8px;
    --milestone-gap: 2px;
    --milestone-medal-right: 8px;
    --milestone-status-right: 72px;
    --milestone-status-bottom: 6px;
    --milestone-side-space: 52px;
    --milestone-status-size: 32px;
    --milestone-no-medal-right: 8px;
    --milestone-medal-width: 36px;
    --milestone-medal-height: 54px;
    --control-padding: 8px;
    --control-bottom-margin: 6px;
    --account-padding: 10px;
    --account-header-bottom: 10px;
    --build-offset: 16px;
    --build-gap: 3px;
    --popup-right: 16px;
    --popup-bottom: 16px;
    --popup-gap: 10px;
    --popup-padding: 12px;
    --popup-border-left-width: 4px;
    --popup-top: 20px;
    --popup-left: 16px;
    --popup-width: 300px;
    --notification-gap: 8px;
    --notification-padding: 12px 14px;
    --notification-icon-margin: 8px 14px 8px 8px;
    --notification-content-gap: 2px;
    --notification-surface: rgba(255, 255, 255, 0.5);
    --notification-text: #000000;
    --notification-error: rgba(255, 179, 179, 0.8);
    --notification-success: rgba(198, 247, 198, 0.8);
    --notification-warning: rgba(255, 235, 153, 0.8);
    --notification-info: rgba(179, 217, 255, 0.8);
    --notification-achievement: rgba(249, 179, 255, 0.8);
    --notification-chat: rgba(199, 189, 255, 0.8);
    --mobile-page-padding: 8px;
    --mobile-panel-header-padding: 9px 10px;
    --mobile-panel-header-gap: 6px;
    --mobile-achievement-panel-min-height: 190px;
    --mobile-milestone-panel-height: 170px;
    --motion-fast: 0.2s;
    --motion-popup: 260ms;
    --motion-fade: 240ms;
    --popup-offset: 14px;
    --sprite-scale: 3;
    --rarity-sprite-size: 8px;
    --status-sprite-size: 16px;
    --sprite-status-scale: 2;
    --sprite-medal-scale: 4;
    --sprite-icon-scale: 4;
}
