:root {
    --primary: #37517e;
    --primary-strong: #2f4b78;
    --primary-hover: #293f66;
    --primary-light: #657da8;
    --primary-soft: #e3edf9;
    --panel: #e6e8f0;
    --page: #eef1f5;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --surface-hover: #eef4fa;
    --surface-translucent: rgba(255,255,255,.95);
    --surface-overlay: rgba(255,255,255,.3);
    --transparent: transparent;
    --text: #1f2937;
    --muted: #667085;
    --border: #c8d2de;
    --border-strong: #9aaabd;
    --divider: #e3e9f0;
    --success: #1f9d70;
    --pix: var(--primary);
    --warning: #d18c22;
    --danger: #d84b57;
    --danger-soft: #fff0f1;
    --danger-translucent: rgba(216,75,87,.22);
    --on-primary: #ffffff;
    --on-primary-muted: #e9ebed;
    --on-primary-border: rgba(255,255,255,.2);
    --on-primary-border-strong: rgba(255,255,255,.25);
    --on-primary-hover: rgba(255,255,255,.3);
    --overlay: rgba(20,32,53,.4);
    --overlay-soft: rgba(0,0,0,.08);
    --overlay-medium: rgba(0,0,0,.3);
    --shadow: 0 10px 28px rgba(55,81,126,.12);
    --shadow-subtle: 0 1px 1px rgba(0,0,0,.14902), 0 1px 2px rgba(0,0,0,.09804);
    --shadow-control: 0 3px 6px rgba(0,0,0,.16);
    --shadow-floating: 0 14px 30px rgba(31,41,55,.2);
    --shadow-banner: 0 12px 35px rgba(0,0,0,.18), 0 4px 12px rgba(0,0,0,.08);
    --shadow-action: 0 6px 14px rgba(47,75,120,.25);
    --radius: 5px;
}