/* ugcscale product shell: prototype geometry, restrained blue, system typography. */
:root,
:root[data-theme="light"] {
    color-scheme: light;
    --bg-0: #f5f5f7;
    --bg-1: #fafafb;
    --bg-2: #ffffff;
    --bg-3: #e9eaee;
    --bg-4: #dfe5ee;
    --line-1: #e6e8ec;
    --line-2: #d3d9e4;
    --tx-1: #1e2024;
    --tx-2: #3d4452;
    --tx-3: #5f6877;
    --ac: #2450d8;
    --ac-h: #1a3ba6;
    --ac-dim: #e8eefd;
    --on-ac: #ffffff;
    --ok: #126b35;
    --ok-dim: #e9f8ef;
    --warn: #8a3300;
    --warn-dim: #fff1e0;
    --danger: #a11b1b;
    --danger-dim: #fdecec;
    --vip: #5b2bb5;
    --vip-dim: #f1e8fd;
    --sh-1: 0 1px 3px rgb(20 23 31 / 8%);
    --sh-2: 0 8px 24px rgb(20 23 31 / 12%);
    --sh-3: 0 12px 32px rgb(20 23 31 / 16%);
    --f-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --f-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 20px;
    --sp-6: 24px;
    --sp-8: 32px;
    --r-1: 4px;
    --r-2: 8px;
    --r-3: 12px;
    --r-4: 16px;
    --r-pill: 999px;
    --shell-rail-width: 80px;
    --shell-subnav-width: 260px;
    --shell-touch: 44px;
    --dur-1: 150ms;
    --ease: cubic-bezier(.16, 1, .3, 1);
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --bg-0: #0b0d13;
    --bg-1: #10131c;
    --bg-2: #161a26;
    --bg-3: #1c2233;
    --bg-4: #242b40;
    --line-1: #232a3d;
    --line-2: #3b4568;
    --tx-1: #eef1f8;
    --tx-2: #b7bfd3;
    --tx-3: #9ca3b4;
    --ac: #8aa5ff;
    --ac-h: #afc1ff;
    --ac-dim: #2a3866;
    --on-ac: #0a1329;
    --ok: #6ee7b7;
    --ok-dim: #124232;
    --warn: #fbbf24;
    --warn-dim: #4a3712;
    --danger: #fca5a5;
    --danger-dim: #4a1c1c;
    --vip: #c4b5fd;
    --vip-dim: #2e2352;
    --sh-1: 0 1px 3px rgb(0 0 0 / 30%);
    --sh-2: 0 8px 24px rgb(0 0 0 / 35%);
    --sh-3: 0 12px 32px rgb(0 0 0 / 45%);
}