/* FC Universe theme tokens. Light defaults; dark values sampled from the original source.
 * Component tokens preserve distinct existing dark surfaces, gradients and borders.
 * Do not reuse accent-fill for text on a light surface.
 */
:root {
  --bg: #F4F7F1;
  --bg-rgb: 244 247 241;
  --card: #FFFFFF;
  --card-rgb: 255 255 255;
  --card-alt: #E6EDDF;
  --card-alt-rgb: 230 237 223;
  --line: #D5DFCB;
  --line-rgb: 213 223 203;
  --text: #0E1A12;
  --text-rgb: 14 26 18;
  --text-2: #4A5A4E;
  --text-2-rgb: 74 90 78;
  --accent-fill: #B3FF24;
  --accent-fill-rgb: 179 255 36;
  --on-accent: #090D0A;
  --on-accent-rgb: 9 13 10;
  --accent-text: #3F7A0B;
  --accent-text-rgb: 63 122 11;
  --accent-text-alt: #3D760A;
  --accent-text-alt-rgb: 61 118 10;
  --accent-hover: #315F08;
  --accent-hover-rgb: 49 95 8;
  --accent-fill-hover: #A0D83B;
  --accent-fill-hover-rgb: 160 216 59;
  --body-copy: #0E1A12;
  --body-copy-rgb: 14 26 18;
  --secondary-copy: #4A5A4E;
  --secondary-copy-rgb: 74 90 78;
  --danger: #B42332;
  --danger-rgb: 180 35 50;
  --white: #ffffff;
  --white-rgb: 255 255 255;
  --black: #000000;
  --black-rgb: 0 0 0;
  --google-label: #0E1A12;
  --google-label-rgb: 14 26 18;
  --google-hover: #E6EDDF;
  --google-hover-rgb: 230 237 223;
  --border-hover: #6D8065;
  --border-hover-rgb: 109 128 101;
  --border-strong: #6D8065;
  --border-strong-rgb: 109 128 101;
  --disabled: #4A5A4E;
  --disabled-rgb: 74 90 78;
  --color-scheme: light;
  --webkit-scrollbar-thumb-surface: var(--card-alt);
  --storefront-header-surface: var(--card);
  --search-box-surface: var(--card);
  --search-results-box-shadow: rgba(14,26,18,.12);
  --account-avatar-surface: var(--card-alt);
  --account-avatar-border: var(--line);
  --account-panel-box-shadow: rgba(14,26,18,.12);
  --account-identity-border-bottom: var(--line);
  --account-library-account-action-icon-surface: rgb(var(--accent-text-rgb) / .06);
  --editorial-hero-surface: #151b14;
  --editorial-hero-before-surface: rgba(21,27,20,.91);
  --editorial-hero-before-surface-2: rgba(21,27,20,.16);
  --editorial-hero-before-surface-3: rgba(16,18,16,.9);
  --hero-copy-eyebrow-ink: #d6dfcf;
  --hero-description-ink: #c4cdc1;
  --fc-button-primary-ink: #151b0b;
  --fc-button-primary-hover-surface: #cafb79;
  --fc-button-outline-border-ink: var(--line);
  --fc-button-outline-hover-surface: var(--card-alt);
  --hero-secondary-border-bottom: #64705e;
  --hero-note-ink: #a3b09e;
  --service-strip-div-ink: var(--text-2);
  --section-index-ink: var(--text-2);
  --featured-image-surface: var(--card-alt);
  --featured-copy-p-ink: var(--text-2);
  --product-card-hover-border-ink: var(--line);
  --login-gate-surface: var(--card);
  --login-gate-div-div-first-child-border-ink: var(--line);
  --game-tab-active-ink: #101210;
  --game-tab-hover-not-active-border-ink: var(--line);
  --game-tab-hover-not-active-surface: var(--card-alt);
  --site-footer-surface: #151815;
  --footer-main-nav-ink: #c3cdc0;
  --skeleton-surface: var(--card-alt);
  --toast-error-surface: #b83338;
  --toast-error-ink: white;
  --toast-warning-surface: #e5bd57;
  --search-box-surface-2: var(--card);
  --editorial-hero-before-surface-4: rgba(21,27,20,.95);
  --editorial-hero-surface-2: #0c160e;
  --editorial-hero-before-surface-5: rgba(12,22,14,.94);
  --editorial-hero-before-surface-6: rgba(12,22,14,.55);
  --editorial-hero-before-surface-7: rgba(12,22,14,.7);
  --hero-description-ink-2: #dbe6d6;
  --hero-note-ink-2: #b6c7ac;
  --hero-art-after-surface: rgba(12,22,14,.2);
  --preview-bar-border-bottom: var(--line);
  --preview-bar-surface: var(--card-alt);
  --preview-bar-ink: var(--text-2);
  --preview-tag-border: var(--line);
  --preview-inner-select-border: var(--line);
  --preview-inner-select-surface: var(--card-alt);
  --preview-inner-select-ink: var(--text-2);
  --header-surface: var(--card);
  --header-border-bottom: var(--line);
  --avatar-surface: var(--card-alt);
  --avatar-border: var(--line);
  --avatar-ink: var(--accent-text-alt);
  --breadcrumb-ink: var(--text-2);
  --breadcrumb-a-ink: var(--text-2);
  --outline-hover-surface: var(--card-alt);
  --outline-hover-border-ink: var(--line);
  --primary-ink: #142006;
  --primary-hover-surface: #c7ff68;
  --account-strip-border: var(--line);
  --account-strip-surface: var(--card-alt);
  --account-strip-surface-2: var(--card-alt);
  --strip-stat-border-left: var(--line);
  --strip-note-ink: var(--text-2);
  --status-dot-neutral-surface: var(--card-alt);
  --section-title-h2-span-surface: var(--card-alt);
  --section-title-h2-span-border: var(--line);
  --library-toolbar-border-bottom: var(--line);
  --filter-hover-surface: var(--card-alt);
  --filter-active-surface: var(--card-alt);
  --filter-active-border-ink: var(--line);
  --search-surface: var(--card);
  --search-border: var(--line);
  --search-svg-ink: var(--text-2);
  --search-input-placeholder-ink: var(--text-2);
  --mod-card-border: var(--line);
  --mod-card-hover-border-ink: var(--line);
  --card-art-surface: #172012;
  --card-art-after-surface: #070d06ed;
  --art-label-span-ink: #d9e6cb;
  --art-corner-border: #a9b49d80;
  --art-corner-surface: #111b10bb;
  --game-tag-ink: var(--text-2);
  --badge-surface: var(--card-alt);
  --badge-ink: var(--accent-text-alt);
  --badge-border: var(--line);
  --badge-warning-surface: #F7EAC7;
  --badge-warning-border-ink: var(--line);
  --badge-warning-ink: #705009;
  --metadata-dt-ink: var(--text-2);
  --metadata-dd-ink: var(--text-2);
  --entitlement-ink: var(--accent-text-alt);
  --mod-symbol-ink: var(--accent-text-alt);
  --mod-symbol-surface: var(--card-alt);
  --mod-symbol-border: var(--line);
  --mod-symbol-vietnamese-surface: var(--card-alt);
  --mod-symbol-vietnamese-ink: var(--accent-text-alt);
  --mod-symbol-vietnamese-border-ink: var(--line);
  --compact-card-metadata-border-top: var(--line);
  --library-footnote-ink: var(--text-2);
  --access-panel-border: var(--line);
  --help-panel-border: var(--line);
  --help-panel-surface: var(--card-alt);
  --help-panel-surface-2: var(--card-alt);
  --sample-note-ink: var(--text-2);
  --sample-note-strong-ink: var(--text-2);
  --empty-state-surface: var(--card);
  --empty-state-border: var(--line);
  --empty-icon-ink: var(--accent-text-alt);
  --google-surface: var(--white);
  --google-ink: var(--text);
  --google-hover-surface: var(--card-alt);
  --guest-art-after-surface: #0d160cf0;
  --footer-border-top: #2a3726;
  --footer-ink: #8e9e86;
  --footer-preview-ink: #b7c5b5;
  --dialog-surface: var(--card);
  --dialog-border: var(--line);
  --dialog-backdrop-surface: #000b;
  --preview-notice-surface: var(--card-alt);
  --payment-banner-border: var(--line);
  --payment-banner-surface: var(--card-alt);
  --payment-check-border: var(--line);
  --payment-demo-ink: var(--text-2);
  --storefront-header-site-navigation-nav-surface: var(--card);
  --storefront-header-site-navigation-nav-a-ho-surface: var(--card);
  --storefront-header-site-navigation-nav-a-na-ink: var(--text-2);
  --hero-section-before-surface: rgba(12,22,14,.97);
  --hero-section-before-surface-2: rgba(12,22,14,.8);
  --hero-section-before-surface-3: rgba(12,22,14,.48);
  --hero-section-before-surface-4: rgba(12,22,14,.15);
  --hero-image-note-ink: #d6ddd3;
  --hero-image-note-text-shadow: #000;
  --hero-image-note-text-shadow-2: rgba(0,0,0,.95);
  --tw-glow-shadow: 0 1px 2px rgba(14,26,18,.06);
  --tw-glow-gold-shadow: 0 1px 2px rgba(14,26,18,.06);
  --tw-glow-blue-shadow: 0 1px 2px rgba(14,26,18,.06);
  --tw-card-shadow: 0 1px 2px rgba(14,26,18,.06);
  --tw-card-hover-shadow: 0 1px 2px rgba(14,26,18,.06);
  --svg-fill: #FFC107;
  --svg-fill-2: #FF3D00;
  --svg-fill-3: #4CAF50;
  --svg-fill-4: #1976D2;
  --body-surface-image: var(--card-alt);
  --body-surface-image-2: var(--card-alt);
  --card-face-surface: var(--card-alt);
  --webkit-scrollbar-thumb-surface-2: var(--card-alt);
  --qr-scan-after-surface: #B3FF24;
  --brand-google-blue: #4285f4;
  --brand-google-green: #34a853;
  --brand-google-yellow: #fbbc05;
  --brand-google-red: #ea4335;
  --free-header-surface: var(--card);
  --step-num-surface: #A0D83B;
  --step-num-ink: #090d0a;
  --body-surface-image-3: var(--card-alt);
  --body-surface-image-4: var(--card-alt);
  --body-surface-image-5: var(--card-alt);
  --body-surface-image-6: var(--card-alt);
  --body-surface-image-7: var(--card-alt);
}

[data-theme="dark"], .theme-fixed-dark, .card-art, .guest-art {
  --bg: #090d0a;
  --bg-rgb: 9 13 10;
  --card: #151e16;
  --card-rgb: 21 30 22;
  --card-alt: #222b23;
  --card-alt-rgb: 34 43 35;
  --line: #3b493b;
  --line-rgb: 59 73 59;
  --text: #ffffff;
  --text-rgb: 255 255 255;
  --text-2: #b7c5b5;
  --text-2-rgb: 183 197 181;
  --accent-fill: #b3ff24;
  --accent-fill-rgb: 179 255 36;
  --on-accent: #090d0a;
  --on-accent-rgb: 9 13 10;
  --accent-text: #b3ff24;
  --accent-text-rgb: 179 255 36;
  --accent-text-alt: #b3ff24;
  --accent-text-alt-rgb: 179 255 36;
  --accent-hover: #A0D83B;
  --accent-hover-rgb: 160 216 59;
  --accent-fill-hover: #A0D83B;
  --accent-fill-hover-rgb: 160 216 59;
  --body-copy: #e2e8f0;
  --body-copy-rgb: 226 232 240;
  --secondary-copy: #cbd5e1;
  --secondary-copy-rgb: 203 213 225;
  --danger: #E5484D;
  --danger-rgb: 229 72 77;
  --white: #ffffff;
  --white-rgb: 255 255 255;
  --black: #000000;
  --black-rgb: 0 0 0;
  --google-label: #0f172a;
  --google-label-rgb: 15 23 42;
  --google-hover: #f1f5f9;
  --google-hover-rgb: 241 245 249;
  --border-hover: #94a3b8;
  --border-hover-rgb: 148 163 184;
  --border-strong: #64748b;
  --border-strong-rgb: 100 116 139;
  --disabled: #475569;
  --disabled-rgb: 71 85 105;
  --color-scheme: dark;
  --webkit-scrollbar-thumb-surface: #454d45;
  --storefront-header-surface: rgba(16,18,16,.97);
  --search-box-surface: #1c201c;
  --search-results-box-shadow: #0008;
  --account-avatar-surface: #27351e;
  --account-avatar-border: #465a34;
  --account-panel-box-shadow: #0009;
  --account-identity-border-bottom: #ffffff0d;
  --account-library-account-action-icon-surface: #b3ff2410;
  --editorial-hero-surface: #151b14;
  --editorial-hero-before-surface: rgba(21,27,20,.91);
  --editorial-hero-before-surface-2: rgba(21,27,20,.16);
  --editorial-hero-before-surface-3: rgba(16,18,16,.9);
  --hero-copy-eyebrow-ink: #d6dfcf;
  --hero-description-ink: #c4cdc1;
  --fc-button-primary-ink: #151b0b;
  --fc-button-primary-hover-surface: #cafb79;
  --fc-button-outline-border-ink: #64705e;
  --fc-button-outline-hover-surface: #2d3429;
  --hero-secondary-border-bottom: #64705e;
  --hero-note-ink: #a3b09e;
  --service-strip-div-ink: #c6cec2;
  --section-index-ink: #8f9a8b;
  --featured-image-surface: #101210;
  --featured-copy-p-ink: #b9c3b5;
  --product-card-hover-border-ink: #718263;
  --login-gate-surface: #191d17;
  --login-gate-div-div-first-child-border-ink: #47503f;
  --game-tab-active-ink: #101210;
  --game-tab-hover-not-active-border-ink: #75876b;
  --game-tab-hover-not-active-surface: #293024;
  --site-footer-surface: #151815;
  --footer-main-nav-ink: #c3cdc0;
  --skeleton-surface: #282e26;
  --toast-error-surface: #b83338;
  --toast-error-ink: white;
  --toast-warning-surface: #e5bd57;
  --search-box-surface-2: #181c17;
  --editorial-hero-before-surface-4: rgba(21,27,20,.95);
  --editorial-hero-surface-2: #0c160e;
  --editorial-hero-before-surface-5: rgba(12,22,14,.94);
  --editorial-hero-before-surface-6: rgba(12,22,14,.55);
  --editorial-hero-before-surface-7: rgba(12,22,14,.7);
  --hero-description-ink-2: #dbe6d6;
  --hero-note-ink-2: #b6c7ac;
  --hero-art-after-surface: rgba(12,22,14,.2);
  --preview-bar-border-bottom: #35452b;
  --preview-bar-surface: #172010;
  --preview-bar-ink: #c9d9b8;
  --preview-tag-border: #6a8c37;
  --preview-inner-select-border: #4a5d3d;
  --preview-inner-select-surface: #202c19;
  --preview-inner-select-ink: #e4eddd;
  --header-surface: #0e140f;
  --header-border-bottom: #29362a;
  --avatar-surface: #293920;
  --avatar-border: #486239;
  --avatar-ink: #c8f896;
  --breadcrumb-ink: #879784;
  --breadcrumb-a-ink: #d5ded1;
  --outline-hover-surface: #202b1c;
  --outline-hover-border-ink: #7a9c5b;
  --primary-ink: #142006;
  --primary-hover-surface: #c7ff68;
  --account-strip-border: #303e2e;
  --account-strip-surface: #182215;
  --account-strip-surface-2: #121a12;
  --strip-stat-border-left: #354531;
  --strip-note-ink: #a5b49d;
  --status-dot-neutral-surface: #95a18b;
  --section-title-h2-span-surface: #222e20;
  --section-title-h2-span-border: #374632;
  --library-toolbar-border-bottom: #283527;
  --filter-hover-surface: #172114;
  --filter-active-surface: #213019;
  --filter-active-border-ink: #47612d;
  --search-surface: #101811;
  --search-border: #35432f;
  --search-svg-ink: #83937b;
  --search-input-placeholder-ink: #8fa088;
  --mod-card-border: #384633;
  --mod-card-hover-border-ink: #637750;
  --card-art-surface: #172012;
  --card-art-after-surface: #070d06ed;
  --art-label-span-ink: #d9e6cb;
  --art-corner-border: #a9b49d80;
  --art-corner-surface: #111b10bb;
  --game-tag-ink: #b6c7aa;
  --badge-surface: #263a17;
  --badge-ink: #c3f89a;
  --badge-border: #476332;
  --badge-warning-surface: #332c18;
  --badge-warning-border-ink: #6d5929;
  --badge-warning-ink: #e4c978;
  --metadata-dt-ink: #98a891;
  --metadata-dd-ink: #eef5e9;
  --entitlement-ink: #aaca94;
  --mod-symbol-ink: #ceff9e;
  --mod-symbol-surface: #283a20;
  --mod-symbol-border: #4a6436;
  --mod-symbol-vietnamese-surface: #223021;
  --mod-symbol-vietnamese-ink: #d6e6cf;
  --mod-symbol-vietnamese-border-ink: #46553e;
  --compact-card-metadata-border-top: #33422e;
  --library-footnote-ink: #8fa086;
  --access-panel-border: #384632;
  --help-panel-border: #35442d;
  --help-panel-surface: #1d2b14;
  --help-panel-surface-2: #121b10;
  --sample-note-ink: #8f9e87;
  --sample-note-strong-ink: #b4c1ac;
  --empty-state-surface: #111a10;
  --empty-state-border: #405235;
  --empty-icon-ink: #a4c786;
  --google-surface: #fff;
  --google-ink: #172014;
  --google-hover-surface: #e9f0e4;
  --guest-art-after-surface: #0d160cf0;
  --footer-border-top: #2a3726;
  --footer-ink: #8e9e86;
  --footer-preview-ink: #b7c5b5;
  --dialog-surface: #182217;
  --dialog-border: #536644;
  --dialog-backdrop-surface: #000b;
  --preview-notice-surface: #23321b;
  --payment-banner-border: #536e36;
  --payment-banner-surface: #1c2c13;
  --payment-check-border: #688f45;
  --payment-demo-ink: #aab99e;
  --storefront-header-site-navigation-nav-surface: #151e16;
  --storefront-header-site-navigation-nav-a-ho-surface: #293024;
  --storefront-header-site-navigation-nav-a-na-ink: #cafb79;
  --hero-section-before-surface: rgba(12,22,14,.97);
  --hero-section-before-surface-2: rgba(12,22,14,.8);
  --hero-section-before-surface-3: rgba(12,22,14,.48);
  --hero-section-before-surface-4: rgba(12,22,14,.15);
  --hero-image-note-ink: #d6ddd3;
  --hero-image-note-text-shadow: #000;
  --hero-image-note-text-shadow-2: rgba(0,0,0,.95);
  --tw-glow-shadow: 0 0 20px rgba(46, 204, 113, 0.4);
  --tw-glow-gold-shadow: 0 0 20px rgba(232, 185, 35, 0.4);
  --tw-glow-blue-shadow: 0 0 20px rgba(59, 130, 246, 0.4);
  --tw-card-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  --tw-card-hover-shadow: 0 12px 40px rgba(46, 204, 113, 0.2);
  --svg-fill: #FFC107;
  --svg-fill-2: #FF3D00;
  --svg-fill-3: #4CAF50;
  --svg-fill-4: #1976D2;
  --body-surface-image: rgba(46, 204, 113, 0.08);
  --body-surface-image-2: rgba(59, 130, 246, 0.08);
  --card-face-surface: #10131C;
  --webkit-scrollbar-thumb-surface-2: #3b493b;
  --qr-scan-after-surface: #B3FF24;
  --brand-google-blue: #4285f4;
  --brand-google-green: #34a853;
  --brand-google-yellow: #fbbc05;
  --brand-google-red: #ea4335;
  --free-header-surface: #090d0a;
  --step-num-surface: #A0D83B;
  --step-num-ink: #090d0a;
  --body-surface-image-3: rgba(116, 163, 47, .14);
  --body-surface-image-4: rgba(74, 119, 71, .12);
  --body-surface-image-5: rgba(183, 197, 181, .12);
  --body-surface-image-6: rgba(116, 163, 47, .1);
  --body-surface-image-7: rgba(74, 119, 71, .07);
}

/* With JavaScript unavailable, follow the device preference. */
@media(prefers-color-scheme:dark){:root:not([data-theme]){
  --bg: #090d0a;
  --bg-rgb: 9 13 10;
  --card: #151e16;
  --card-rgb: 21 30 22;
  --card-alt: #222b23;
  --card-alt-rgb: 34 43 35;
  --line: #3b493b;
  --line-rgb: 59 73 59;
  --text: #ffffff;
  --text-rgb: 255 255 255;
  --text-2: #b7c5b5;
  --text-2-rgb: 183 197 181;
  --accent-fill: #b3ff24;
  --accent-fill-rgb: 179 255 36;
  --on-accent: #090d0a;
  --on-accent-rgb: 9 13 10;
  --accent-text: #b3ff24;
  --accent-text-rgb: 179 255 36;
  --accent-text-alt: #b3ff24;
  --accent-text-alt-rgb: 179 255 36;
  --accent-hover: #A0D83B;
  --accent-hover-rgb: 160 216 59;
  --accent-fill-hover: #A0D83B;
  --accent-fill-hover-rgb: 160 216 59;
  --body-copy: #e2e8f0;
  --body-copy-rgb: 226 232 240;
  --secondary-copy: #cbd5e1;
  --secondary-copy-rgb: 203 213 225;
  --danger: #E5484D;
  --danger-rgb: 229 72 77;
  --white: #ffffff;
  --white-rgb: 255 255 255;
  --black: #000000;
  --black-rgb: 0 0 0;
  --google-label: #0f172a;
  --google-label-rgb: 15 23 42;
  --google-hover: #f1f5f9;
  --google-hover-rgb: 241 245 249;
  --border-hover: #94a3b8;
  --border-hover-rgb: 148 163 184;
  --border-strong: #64748b;
  --border-strong-rgb: 100 116 139;
  --disabled: #475569;
  --disabled-rgb: 71 85 105;
  --color-scheme: dark;
  --webkit-scrollbar-thumb-surface: #454d45;
  --storefront-header-surface: rgba(16,18,16,.97);
  --search-box-surface: #1c201c;
  --search-results-box-shadow: #0008;
  --account-avatar-surface: #27351e;
  --account-avatar-border: #465a34;
  --account-panel-box-shadow: #0009;
  --account-identity-border-bottom: #ffffff0d;
  --account-library-account-action-icon-surface: #b3ff2410;
  --editorial-hero-surface: #151b14;
  --editorial-hero-before-surface: rgba(21,27,20,.91);
  --editorial-hero-before-surface-2: rgba(21,27,20,.16);
  --editorial-hero-before-surface-3: rgba(16,18,16,.9);
  --hero-copy-eyebrow-ink: #d6dfcf;
  --hero-description-ink: #c4cdc1;
  --fc-button-primary-ink: #151b0b;
  --fc-button-primary-hover-surface: #cafb79;
  --fc-button-outline-border-ink: #64705e;
  --fc-button-outline-hover-surface: #2d3429;
  --hero-secondary-border-bottom: #64705e;
  --hero-note-ink: #a3b09e;
  --service-strip-div-ink: #c6cec2;
  --section-index-ink: #8f9a8b;
  --featured-image-surface: #101210;
  --featured-copy-p-ink: #b9c3b5;
  --product-card-hover-border-ink: #718263;
  --login-gate-surface: #191d17;
  --login-gate-div-div-first-child-border-ink: #47503f;
  --game-tab-active-ink: #101210;
  --game-tab-hover-not-active-border-ink: #75876b;
  --game-tab-hover-not-active-surface: #293024;
  --site-footer-surface: #151815;
  --footer-main-nav-ink: #c3cdc0;
  --skeleton-surface: #282e26;
  --toast-error-surface: #b83338;
  --toast-error-ink: white;
  --toast-warning-surface: #e5bd57;
  --search-box-surface-2: #181c17;
  --editorial-hero-before-surface-4: rgba(21,27,20,.95);
  --editorial-hero-surface-2: #0c160e;
  --editorial-hero-before-surface-5: rgba(12,22,14,.94);
  --editorial-hero-before-surface-6: rgba(12,22,14,.55);
  --editorial-hero-before-surface-7: rgba(12,22,14,.7);
  --hero-description-ink-2: #dbe6d6;
  --hero-note-ink-2: #b6c7ac;
  --hero-art-after-surface: rgba(12,22,14,.2);
  --preview-bar-border-bottom: #35452b;
  --preview-bar-surface: #172010;
  --preview-bar-ink: #c9d9b8;
  --preview-tag-border: #6a8c37;
  --preview-inner-select-border: #4a5d3d;
  --preview-inner-select-surface: #202c19;
  --preview-inner-select-ink: #e4eddd;
  --header-surface: #0e140f;
  --header-border-bottom: #29362a;
  --avatar-surface: #293920;
  --avatar-border: #486239;
  --avatar-ink: #c8f896;
  --breadcrumb-ink: #879784;
  --breadcrumb-a-ink: #d5ded1;
  --outline-hover-surface: #202b1c;
  --outline-hover-border-ink: #7a9c5b;
  --primary-ink: #142006;
  --primary-hover-surface: #c7ff68;
  --account-strip-border: #303e2e;
  --account-strip-surface: #182215;
  --account-strip-surface-2: #121a12;
  --strip-stat-border-left: #354531;
  --strip-note-ink: #a5b49d;
  --status-dot-neutral-surface: #95a18b;
  --section-title-h2-span-surface: #222e20;
  --section-title-h2-span-border: #374632;
  --library-toolbar-border-bottom: #283527;
  --filter-hover-surface: #172114;
  --filter-active-surface: #213019;
  --filter-active-border-ink: #47612d;
  --search-surface: #101811;
  --search-border: #35432f;
  --search-svg-ink: #83937b;
  --search-input-placeholder-ink: #8fa088;
  --mod-card-border: #384633;
  --mod-card-hover-border-ink: #637750;
  --card-art-surface: #172012;
  --card-art-after-surface: #070d06ed;
  --art-label-span-ink: #d9e6cb;
  --art-corner-border: #a9b49d80;
  --art-corner-surface: #111b10bb;
  --game-tag-ink: #b6c7aa;
  --badge-surface: #263a17;
  --badge-ink: #c3f89a;
  --badge-border: #476332;
  --badge-warning-surface: #332c18;
  --badge-warning-border-ink: #6d5929;
  --badge-warning-ink: #e4c978;
  --metadata-dt-ink: #98a891;
  --metadata-dd-ink: #eef5e9;
  --entitlement-ink: #aaca94;
  --mod-symbol-ink: #ceff9e;
  --mod-symbol-surface: #283a20;
  --mod-symbol-border: #4a6436;
  --mod-symbol-vietnamese-surface: #223021;
  --mod-symbol-vietnamese-ink: #d6e6cf;
  --mod-symbol-vietnamese-border-ink: #46553e;
  --compact-card-metadata-border-top: #33422e;
  --library-footnote-ink: #8fa086;
  --access-panel-border: #384632;
  --help-panel-border: #35442d;
  --help-panel-surface: #1d2b14;
  --help-panel-surface-2: #121b10;
  --sample-note-ink: #8f9e87;
  --sample-note-strong-ink: #b4c1ac;
  --empty-state-surface: #111a10;
  --empty-state-border: #405235;
  --empty-icon-ink: #a4c786;
  --google-surface: #fff;
  --google-ink: #172014;
  --google-hover-surface: #e9f0e4;
  --guest-art-after-surface: #0d160cf0;
  --footer-border-top: #2a3726;
  --footer-ink: #8e9e86;
  --footer-preview-ink: #b7c5b5;
  --dialog-surface: #182217;
  --dialog-border: #536644;
  --dialog-backdrop-surface: #000b;
  --preview-notice-surface: #23321b;
  --payment-banner-border: #536e36;
  --payment-banner-surface: #1c2c13;
  --payment-check-border: #688f45;
  --payment-demo-ink: #aab99e;
  --storefront-header-site-navigation-nav-surface: #151e16;
  --storefront-header-site-navigation-nav-a-ho-surface: #293024;
  --storefront-header-site-navigation-nav-a-na-ink: #cafb79;
  --hero-section-before-surface: rgba(12,22,14,.97);
  --hero-section-before-surface-2: rgba(12,22,14,.8);
  --hero-section-before-surface-3: rgba(12,22,14,.48);
  --hero-section-before-surface-4: rgba(12,22,14,.15);
  --hero-image-note-ink: #d6ddd3;
  --hero-image-note-text-shadow: #000;
  --hero-image-note-text-shadow-2: rgba(0,0,0,.95);
  --tw-glow-shadow: 0 0 20px rgba(46, 204, 113, 0.4);
  --tw-glow-gold-shadow: 0 0 20px rgba(232, 185, 35, 0.4);
  --tw-glow-blue-shadow: 0 0 20px rgba(59, 130, 246, 0.4);
  --tw-card-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  --tw-card-hover-shadow: 0 12px 40px rgba(46, 204, 113, 0.2);
  --svg-fill: #FFC107;
  --svg-fill-2: #FF3D00;
  --svg-fill-3: #4CAF50;
  --svg-fill-4: #1976D2;
  --body-surface-image: rgba(46, 204, 113, 0.08);
  --body-surface-image-2: rgba(59, 130, 246, 0.08);
  --card-face-surface: #10131C;
  --webkit-scrollbar-thumb-surface-2: #3b493b;
  --qr-scan-after-surface: #B3FF24;
  --brand-google-blue: #4285f4;
  --brand-google-green: #34a853;
  --brand-google-yellow: #fbbc05;
  --brand-google-red: #ea4335;
  --free-header-surface: #090d0a;
  --step-num-surface: #A0D83B;
  --step-num-ink: #090d0a;
  --body-surface-image-3: rgba(116, 163, 47, .14);
  --body-surface-image-4: rgba(74, 119, 71, .12);
  --body-surface-image-5: rgba(183, 197, 181, .12);
  --body-surface-image-6: rgba(116, 163, 47, .1);
  --body-surface-image-7: rgba(74, 119, 71, .07);
}}

:root, .theme-fixed-dark, .card-art, .guest-art {
  --fc-bg:var(--bg);--fc-surface:var(--card);--fc-line:var(--line);
  --fc-text:var(--text);--fc-muted:var(--text-2);--fc-accent:var(--accent-fill);
color-scheme:var(--color-scheme);
}

/* Shared, keyboard-accessible appearance picker. */
:root {
  --shadow-subtle:0 1px 2px rgba(14,26,18,.06);
  --shadow-popover:0 12px 32px rgba(14,26,18,.14);
  --ripple:rgba(255,255,255,.3);
  --manual-copy-border:#64705e;
  --login-gate-icon:#A3ACA3;
}
.header-account-controls{display:flex;align-items:center;gap:8px;flex-shrink:0}
.theme-picker{position:relative;flex-shrink:0;line-height:1.5;color:var(--text)}
.theme-picker>summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;list-style:none;cursor:pointer;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--text)}
.theme-picker>summary::-webkit-details-marker{display:none}
.theme-picker>summary:hover,.theme-picker[open]>summary{background:var(--card-alt)}
.theme-picker>summary:focus-visible,.theme-options button:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px}
.theme-picker svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-moon{display:none}
[data-theme="dark"] .theme-sun{display:none}
[data-theme="dark"] .theme-moon{display:block}
.theme-options{position:absolute;right:0;top:calc(100% + 8px);width:188px;padding:8px;z-index:80;border:1px solid var(--line);border-radius:8px;background:var(--card);box-shadow:var(--shadow-popover)}
.theme-options>span{display:block;padding:8px 10px;color:var(--text-2);font:500 12px/1.5 var(--fc-font)}
.theme-options button{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;min-height:44px;padding:10px;border:0;border-radius:4px;background:transparent;color:var(--text);font:500 13px/1.5 var(--fc-font);text-align:left}
.theme-options button:hover{background:var(--card-alt)}
.theme-options button[aria-pressed="true"]{background:var(--card-alt);color:var(--accent-text-alt)}
.theme-options button span{visibility:hidden}
.theme-options button[aria-pressed="true"] span{visibility:visible}
.theme-fixed-dark{color:var(--body-copy)}
.card-art,.guest-art{color:var(--text)}
.free-copy input[readonly]{color:var(--text)!important;background:var(--card)!important;border-color:var(--manual-copy-border)!important}

/* Light surfaces: dark green text, quiet outlines and restrained depth. */
html[data-theme="light"]{--manual-copy-border:var(--line);--login-gate-icon:var(--text-2);--section-index-ink:var(--accent-text)}
html[data-theme="light"] body>header{background:var(--card)}
html[data-theme="light"] header img[src="logo.png"]{filter:brightness(0) saturate(100%) invert(8%) sepia(15%) saturate(1036%) hue-rotate(83deg) brightness(95%) contrast(97%)}
html[data-theme="light"] :is(.card-face,.product-card,.free-card,.mod-card,.guest-view,.access-panel,.help-panel,.home-faq-item){box-shadow:var(--shadow-subtle)}
html[data-theme="light"] :is(.modal-panel,dialog,.account-panel,.account-dropdown,#search-results){box-shadow:var(--shadow-popover)}
html[data-theme="light"] :is(.help-panel,.account-strip){background:var(--card)}
html[data-theme="light"] .product-card .num{filter:none}
html[data-theme="light"] .filter.active{background:var(--accent-fill);border-color:var(--accent-fill);color:var(--on-accent)}
html[data-theme="light"] :is(.account-avatar,.badge,.mod-symbol,.theme-options,.bg-card2,.bg-card2\/80){--accent-text:var(--accent-text-alt);--accent-text-rgb:var(--accent-text-alt-rgb)}
html[data-theme="light"] #btn-google,html[data-theme="light"] .google{border:1px solid var(--line);box-shadow:var(--shadow-subtle)}
html[data-theme="light"] .fc-button-outline{background:var(--card-alt);color:var(--text)}
html[data-theme="light"] .theme-fixed-dark .fc-button-outline{background:transparent;color:var(--text)}
html[data-theme="light"] footer.theme-fixed-dark{background:var(--site-footer-surface)}
html[data-theme="light"] footer.free-footer{padding-left:24px;padding-right:24px}
html[data-theme="light"] main.wrap>footer{padding-left:20px;padding-right:20px;border-radius:6px}

@media(max-width:1100px){
  .storefront>header .header-account-controls{grid-column:2;grid-row:1;justify-self:end}
}
@media(max-width:600px){
  .header .header-account-controls{display:contents}
  html .header .header-inner{position:relative}
  html .header .theme-picker{position:absolute;right:20px;bottom:8px}
  html .header .main-nav{grid-column:1/-1;grid-row:2;gap:14px;justify-content:flex-start;padding-right:56px}
  html .header .main-nav a{white-space:nowrap;flex-shrink:0}
  .header-account-controls{gap:6px}
  body:not(.storefront)>header:not(.header)>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
  body:not(.storefront)>header:not(.header) .header-account-controls{display:contents}
  body:not(.storefront)>header:not(.header) .theme-picker{grid-column:2;grid-row:1;justify-self:end}
  body:not(.storefront)>header:not(.header) .header-account-controls>a{grid-column:1/-1;grid-row:2;justify-self:start}
}
@media(max-width:540px){
  html .storefront>header>div{grid-template-columns:minmax(0,1fr) auto auto}
  html .storefront>header>div>a{grid-column:1/3}
  html .storefront>header .header-account-controls{display:contents}
  html .storefront>header #auth-area{grid-column:3;grid-row:1}
  html .storefront>header .theme-picker{grid-column:2;grid-row:2}
  html .storefront>header .site-navigation{grid-column:3;grid-row:2}
  html .storefront>header .header-search{grid-column:1;grid-row:2}
  html .storefront>header .font-display{white-space:nowrap}
}
@media(max-width:374px){
  .header .theme-picker{right:12px}
  .header .brand{gap:6px}.header .brand strong{font-size:15px}.header .brand img{width:28px;height:28px}
  .header-account-controls{gap:4px}
  .storefront #btn-header-login{padding-left:8px;padding-right:8px}
}

/* QR paper stays white in both modes; its caption must always use dark green. */
:root{--paper-accent-text:#3F7A0B;--paper-accent-rgb:63 122 11}
.qr-paper{--accent-text:var(--paper-accent-text);--accent-text-rgb:var(--paper-accent-rgb)}
