/* Generated from shared/design-tokens/strong-glass.json. SHA256 a9769bc345eddc792ccc9ff2d999045ae345344ff1f10a2d4f0e992ea4713ff4 */

:root {
  --okg-canvas:#F3F6F5;
  --okg-surface:#F6F9F8;
  --okg-raised:#FFFFFF;
  --okg-text:#22333C;
  --okg-text-muted:#3D515B;
  --okg-accent:#543099;
  --okg-accent-hover:#48278B;
  --okg-accent-active:#3E207C;
  --okg-on-accent:#FFFFFF;
  --okg-accent-soft:#EAE6F0;
  --okg-on-accent-soft:#48238F;
  --okg-border-strong:#748286;
  --okg-border-subtle:#D3DEDE;
  --okg-focus:#4F25AC;
  --okg-focus-separator:#FFFFFF;
  --okg-brand:#543099;
  --okg-scrollbar-thumb:#748286;
  --okg-scrollbar-thumb-hover:#45545B;
  --okg-scrollbar-track:#F3F6F5;
  --okg-ambient-a:#D2E1E9;
  --okg-ambient-b:#DFE9E2;
  --okg-ambient-c:#E9E5DE;
  --okg-disabled-surface:#E4EBE8;
  --okg-disabled-text:#45545B;
  --okg-success:#125332;
  --okg-success-surface:#E8F5ED;
  --okg-warning:#603F05;
  --okg-warning-surface:#FFF3D6;
  --okg-error:#861D32;
  --okg-error-surface:#FCECF0;
  --okg-info:#194A7A;
  --okg-info-surface:#E9F2FF;
  --okg-stage:radial-gradient(ellipse at 84% 16%,#E0ECE6 0%,rgb(224 236 230 / 0) 44%),radial-gradient(ellipse at 9% 82%,#EFE8DE 0%,rgb(239 232 222 / 0) 48%),linear-gradient(128deg,#DCE8F0 0%,#EFE8DE 35%,#E0ECE6 70%,#DCE7EF 100%);
  --okg-stage-0:#DCE8F0;
  --okg-stage-1:#EFE8DE;
  --okg-stage-2:#E0ECE6;
  --okg-stage-3:#DCE7EF;
  --okg-g1-tint:rgb(246 249 248 / 0.4);
  --okg-g1-radius:26px;
  --okg-g1-blur:26px;
  --okg-g2-tint:rgb(246 249 248 / 0.54);
  --okg-g2-radius:22px;
  --okg-g2-blur:20px;
  --okg-d1-tint:rgb(246 249 248 / 0.9);
  --okg-d1-radius:26px;
  --okg-d1-blur:26px;
  --okg-s1-tint:rgb(246 249 248 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(234 230 240 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-g3-tint:rgb(246 249 248 / 0.2);
  --okg-g3-radius:16px;
  --okg-g3-blur:0px;
  --okg-g4-tint:rgb(246 249 248 / 0.74);
  --okg-g4-radius:12px;
  --okg-g4-blur:0px;
  --okg-rim-depth:1px;
  --okg-rim-blur:0px;
  --okg-edge-outer:rgb(255 255 255 / 0.72);
  --okg-edge-lower:rgb(111 135 150 / 0.2);
  --okg-edge-inner:rgb(255 255 255 / 0.64);
  --okg-edge-reflection:rgb(255 255 255 / 0.54);
  --okg-shadow:0px 18px 48px -14px rgb(36 49 58 / 0.16),0px 4px 14px -6px rgb(36 49 58 / 0.12);
}

[data-workspace-kind="private"][data-theme="light"] {
  --okg-canvas:#F3F6F5;
  --okg-surface:#F6F9F8;
  --okg-raised:#FFFFFF;
  --okg-text:#22333C;
  --okg-text-muted:#3D515B;
  --okg-accent:#543099;
  --okg-accent-hover:#48278B;
  --okg-accent-active:#3E207C;
  --okg-on-accent:#FFFFFF;
  --okg-accent-soft:#EAE6F0;
  --okg-on-accent-soft:#48238F;
  --okg-border-strong:#748286;
  --okg-border-subtle:#D3DEDE;
  --okg-focus:#4F25AC;
  --okg-focus-separator:#FFFFFF;
  --okg-brand:#543099;
  --okg-scrollbar-thumb:#748286;
  --okg-scrollbar-thumb-hover:#45545B;
  --okg-scrollbar-track:#F3F6F5;
  --okg-ambient-a:#D2E1E9;
  --okg-ambient-b:#DFE9E2;
  --okg-ambient-c:#E9E5DE;
  --okg-disabled-surface:#E4EBE8;
  --okg-disabled-text:#45545B;
  --okg-success:#125332;
  --okg-success-surface:#E8F5ED;
  --okg-warning:#603F05;
  --okg-warning-surface:#FFF3D6;
  --okg-error:#861D32;
  --okg-error-surface:#FCECF0;
  --okg-info:#194A7A;
  --okg-info-surface:#E9F2FF;
  --okg-stage:radial-gradient(ellipse at 84% 16%,#E0ECE6 0%,rgb(224 236 230 / 0) 44%),radial-gradient(ellipse at 9% 82%,#EFE8DE 0%,rgb(239 232 222 / 0) 48%),linear-gradient(128deg,#DCE8F0 0%,#EFE8DE 35%,#E0ECE6 70%,#DCE7EF 100%);
  --okg-stage-0:#DCE8F0;
  --okg-stage-1:#EFE8DE;
  --okg-stage-2:#E0ECE6;
  --okg-stage-3:#DCE7EF;
  --okg-g1-tint:rgb(246 249 248 / 0.4);
  --okg-g1-radius:26px;
  --okg-g1-blur:26px;
  --okg-g2-tint:rgb(246 249 248 / 0.54);
  --okg-g2-radius:22px;
  --okg-g2-blur:20px;
  --okg-d1-tint:rgb(246 249 248 / 0.9);
  --okg-d1-radius:26px;
  --okg-d1-blur:26px;
  --okg-s1-tint:rgb(246 249 248 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(234 230 240 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-g3-tint:rgb(246 249 248 / 0.2);
  --okg-g3-radius:16px;
  --okg-g3-blur:0px;
  --okg-g4-tint:rgb(246 249 248 / 0.74);
  --okg-g4-radius:12px;
  --okg-g4-blur:0px;
  --okg-rim-depth:1px;
  --okg-rim-blur:0px;
  --okg-edge-outer:rgb(255 255 255 / 0.72);
  --okg-edge-lower:rgb(111 135 150 / 0.2);
  --okg-edge-inner:rgb(255 255 255 / 0.64);
  --okg-edge-reflection:rgb(255 255 255 / 0.54);
  --okg-shadow:0px 18px 48px -14px rgb(36 49 58 / 0.16),0px 4px 14px -6px rgb(36 49 58 / 0.12);
  color-scheme:light;
}

[data-workspace-kind="private"][data-theme="contrast"] {
  --okg-canvas:#000000;
  --okg-surface:#000000;
  --okg-raised:#161616;
  --okg-text:#FFFFFF;
  --okg-text-muted:#EDEDED;
  --okg-accent:#D6BDFF;
  --okg-accent-hover:#E8D8FF;
  --okg-accent-active:#C9AAFF;
  --okg-on-accent:#000000;
  --okg-accent-soft:#000000;
  --okg-on-accent-soft:#D6BDFF;
  --okg-border-strong:#FFFFFF;
  --okg-border-subtle:#FFFFFF;
  --okg-focus:#FFE869;
  --okg-focus-separator:#000000;
  --okg-brand:#C9AAFF;
  --okg-scrollbar-thumb:#FFFFFF;
  --okg-scrollbar-thumb-hover:#FFE869;
  --okg-scrollbar-track:#000000;
  --okg-ambient-a:#634480;
  --okg-ambient-b:#84586B;
  --okg-ambient-c:#383148;
  --okg-disabled-surface:#161616;
  --okg-disabled-text:#EDEDED;
  --okg-success:#FFFFFF;
  --okg-success-surface:#000000;
  --okg-warning:#FFFFFF;
  --okg-warning-surface:#000000;
  --okg-error:#FFFFFF;
  --okg-error-surface:#000000;
  --okg-info:#FFFFFF;
  --okg-info-surface:#000000;
  --okg-stage:#000000;
  --okg-g1-tint:rgb(0 0 0 / 1);
  --okg-g1-radius:20px;
  --okg-g1-blur:0px;
  --okg-g2-tint:rgb(0 0 0 / 1);
  --okg-g2-radius:22px;
  --okg-g2-blur:0px;
  --okg-d1-tint:rgb(0 0 0 / 1);
  --okg-d1-radius:28px;
  --okg-d1-blur:0px;
  --okg-s1-tint:rgb(0 0 0 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(0 0 0 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-rim-depth:4px;
  --okg-rim-blur:5px;
  --okg-edge-outer:transparent;
  --okg-edge-lower:transparent;
  --okg-edge-inner:transparent;
  --okg-edge-reflection:transparent;
  --okg-shadow:none;
  color-scheme:dark;
}

[data-workspace-kind="business"][data-theme="light"] {
  --okg-canvas:#F3F6F5;
  --okg-surface:#F6F9F8;
  --okg-raised:#FFFFFF;
  --okg-text:#22333C;
  --okg-text-muted:#3D515B;
  --okg-accent:#543099;
  --okg-accent-hover:#48278B;
  --okg-accent-active:#3E207C;
  --okg-on-accent:#FFFFFF;
  --okg-accent-soft:#EAE6F0;
  --okg-on-accent-soft:#48238F;
  --okg-border-strong:#748286;
  --okg-border-subtle:#D3DEDE;
  --okg-focus:#4F25AC;
  --okg-focus-separator:#FFFFFF;
  --okg-brand:#543099;
  --okg-scrollbar-thumb:#748286;
  --okg-scrollbar-thumb-hover:#45545B;
  --okg-scrollbar-track:#F3F6F5;
  --okg-ambient-a:#D2E1E9;
  --okg-ambient-b:#DFE9E2;
  --okg-ambient-c:#E9E5DE;
  --okg-disabled-surface:#E4EBE8;
  --okg-disabled-text:#45545B;
  --okg-success:#125332;
  --okg-success-surface:#E8F5ED;
  --okg-warning:#603F05;
  --okg-warning-surface:#FFF3D6;
  --okg-error:#861D32;
  --okg-error-surface:#FCECF0;
  --okg-info:#194A7A;
  --okg-info-surface:#E9F2FF;
  --okg-stage:radial-gradient(ellipse at 84% 16%,#E0ECE6 0%,rgb(224 236 230 / 0) 44%),radial-gradient(ellipse at 9% 82%,#EFE8DE 0%,rgb(239 232 222 / 0) 48%),linear-gradient(128deg,#DCE8F0 0%,#EFE8DE 35%,#E0ECE6 70%,#DCE7EF 100%);
  --okg-stage-0:#DCE8F0;
  --okg-stage-1:#EFE8DE;
  --okg-stage-2:#E0ECE6;
  --okg-stage-3:#DCE7EF;
  --okg-g1-tint:rgb(246 249 248 / 0.4);
  --okg-g1-radius:26px;
  --okg-g1-blur:26px;
  --okg-g2-tint:rgb(246 249 248 / 0.54);
  --okg-g2-radius:22px;
  --okg-g2-blur:20px;
  --okg-d1-tint:rgb(246 249 248 / 0.9);
  --okg-d1-radius:26px;
  --okg-d1-blur:26px;
  --okg-s1-tint:rgb(246 249 248 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(234 230 240 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-g3-tint:rgb(246 249 248 / 0.2);
  --okg-g3-radius:16px;
  --okg-g3-blur:0px;
  --okg-g4-tint:rgb(246 249 248 / 0.74);
  --okg-g4-radius:12px;
  --okg-g4-blur:0px;
  --okg-rim-depth:1px;
  --okg-rim-blur:0px;
  --okg-edge-outer:rgb(255 255 255 / 0.72);
  --okg-edge-lower:rgb(111 135 150 / 0.2);
  --okg-edge-inner:rgb(255 255 255 / 0.64);
  --okg-edge-reflection:rgb(255 255 255 / 0.54);
  --okg-shadow:0px 18px 48px -14px rgb(36 49 58 / 0.16),0px 4px 14px -6px rgb(36 49 58 / 0.12);
  color-scheme:light;
}

[data-workspace-kind="business"][data-theme="contrast"] {
  --okg-canvas:#000000;
  --okg-surface:#000000;
  --okg-raised:#161616;
  --okg-text:#FFFFFF;
  --okg-text-muted:#EDEDED;
  --okg-accent:#A5FFF2;
  --okg-accent-hover:#CCFFF8;
  --okg-accent-active:#79D8D3;
  --okg-on-accent:#000000;
  --okg-accent-soft:#000000;
  --okg-on-accent-soft:#A5FFF2;
  --okg-border-strong:#FFFFFF;
  --okg-border-subtle:#FFFFFF;
  --okg-focus:#FFE869;
  --okg-focus-separator:#000000;
  --okg-brand:#A5FFF2;
  --okg-scrollbar-thumb:#FFFFFF;
  --okg-scrollbar-thumb-hover:#FFE869;
  --okg-scrollbar-track:#000000;
  --okg-ambient-a:#000000;
  --okg-ambient-b:#000000;
  --okg-ambient-c:#000000;
  --okg-disabled-surface:#161616;
  --okg-disabled-text:#EDEDED;
  --okg-success:#FFFFFF;
  --okg-success-surface:#000000;
  --okg-warning:#FFFFFF;
  --okg-warning-surface:#000000;
  --okg-error:#FFFFFF;
  --okg-error-surface:#000000;
  --okg-info:#FFFFFF;
  --okg-info-surface:#000000;
  --okg-stage:#000000;
  --okg-g1-tint:rgb(0 0 0 / 1);
  --okg-g1-radius:20px;
  --okg-g1-blur:0px;
  --okg-g2-tint:rgb(0 0 0 / 1);
  --okg-g2-radius:22px;
  --okg-g2-blur:0px;
  --okg-d1-tint:rgb(0 0 0 / 1);
  --okg-d1-radius:28px;
  --okg-d1-blur:0px;
  --okg-s1-tint:rgb(0 0 0 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(0 0 0 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-rim-depth:4px;
  --okg-rim-blur:5px;
  --okg-edge-outer:transparent;
  --okg-edge-lower:transparent;
  --okg-edge-inner:transparent;
  --okg-edge-reflection:transparent;
  --okg-shadow:none;
  color-scheme:dark;
}

[data-workspace-kind="private"][data-color-world="aeria"][data-theme="light"] {
  --okg-canvas:#F3F6F5;
  --okg-surface:#F6F9F8;
  --okg-raised:#FFFFFF;
  --okg-text:#22333C;
  --okg-text-muted:#3D515B;
  --okg-accent:#543099;
  --okg-accent-hover:#48278B;
  --okg-accent-active:#3E207C;
  --okg-on-accent:#FFFFFF;
  --okg-accent-soft:#EAE6F0;
  --okg-on-accent-soft:#48238F;
  --okg-border-strong:#748286;
  --okg-border-subtle:#D3DEDE;
  --okg-focus:#4F25AC;
  --okg-focus-separator:#FFFFFF;
  --okg-brand:#543099;
  --okg-scrollbar-thumb:#748286;
  --okg-scrollbar-thumb-hover:#45545B;
  --okg-scrollbar-track:#F3F6F5;
  --okg-ambient-a:#D2E1E9;
  --okg-ambient-b:#DFE9E2;
  --okg-ambient-c:#E9E5DE;
  --okg-disabled-surface:#E4EBE8;
  --okg-disabled-text:#45545B;
  --okg-success:#125332;
  --okg-success-surface:#E8F5ED;
  --okg-warning:#603F05;
  --okg-warning-surface:#FFF3D6;
  --okg-error:#861D32;
  --okg-error-surface:#FCECF0;
  --okg-info:#194A7A;
  --okg-info-surface:#E9F2FF;
  --okg-stage:radial-gradient(ellipse at 84% 16%,#E0ECE6 0%,rgb(224 236 230 / 0) 44%),radial-gradient(ellipse at 9% 82%,#EFE8DE 0%,rgb(239 232 222 / 0) 48%),linear-gradient(128deg,#DCE8F0 0%,#EFE8DE 35%,#E0ECE6 70%,#DCE7EF 100%);
  --okg-stage-0:#DCE8F0;
  --okg-stage-1:#EFE8DE;
  --okg-stage-2:#E0ECE6;
  --okg-stage-3:#DCE7EF;
  --okg-g1-tint:rgb(246 249 248 / 0.4);
  --okg-g1-radius:26px;
  --okg-g1-blur:26px;
  --okg-g2-tint:rgb(246 249 248 / 0.54);
  --okg-g2-radius:22px;
  --okg-g2-blur:20px;
  --okg-d1-tint:rgb(246 249 248 / 0.9);
  --okg-d1-radius:26px;
  --okg-d1-blur:26px;
  --okg-s1-tint:rgb(246 249 248 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(234 230 240 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-g3-tint:rgb(246 249 248 / 0.2);
  --okg-g3-radius:16px;
  --okg-g3-blur:0px;
  --okg-g4-tint:rgb(246 249 248 / 0.74);
  --okg-g4-radius:12px;
  --okg-g4-blur:0px;
  --okg-rim-depth:1px;
  --okg-rim-blur:0px;
  --okg-edge-outer:rgb(255 255 255 / 0.72);
  --okg-edge-lower:rgb(111 135 150 / 0.2);
  --okg-edge-inner:rgb(255 255 255 / 0.64);
  --okg-edge-reflection:rgb(255 255 255 / 0.54);
  --okg-shadow:0px 18px 48px -14px rgb(36 49 58 / 0.16),0px 4px 14px -6px rgb(36 49 58 / 0.12);
  color-scheme:light;
}

[data-workspace-kind="private"][data-color-world="aeria"][data-theme="contrast"] {
  --okg-canvas:#000000;
  --okg-surface:#000000;
  --okg-raised:#161616;
  --okg-text:#FFFFFF;
  --okg-text-muted:#EDEDED;
  --okg-accent:#D6BDFF;
  --okg-accent-hover:#E8D8FF;
  --okg-accent-active:#C9AAFF;
  --okg-on-accent:#000000;
  --okg-accent-soft:#000000;
  --okg-on-accent-soft:#D6BDFF;
  --okg-border-strong:#FFFFFF;
  --okg-border-subtle:#FFFFFF;
  --okg-focus:#FFE869;
  --okg-focus-separator:#000000;
  --okg-brand:#C9AAFF;
  --okg-scrollbar-thumb:#FFFFFF;
  --okg-scrollbar-thumb-hover:#FFE869;
  --okg-scrollbar-track:#000000;
  --okg-ambient-a:#000000;
  --okg-ambient-b:#000000;
  --okg-ambient-c:#000000;
  --okg-disabled-surface:#161616;
  --okg-disabled-text:#EDEDED;
  --okg-success:#FFFFFF;
  --okg-success-surface:#000000;
  --okg-warning:#FFFFFF;
  --okg-warning-surface:#000000;
  --okg-error:#FFFFFF;
  --okg-error-surface:#000000;
  --okg-info:#FFFFFF;
  --okg-info-surface:#000000;
  --okg-stage:#000000;
  --okg-g1-tint:rgb(0 0 0 / 1);
  --okg-g1-radius:20px;
  --okg-g1-blur:0px;
  --okg-g2-tint:rgb(0 0 0 / 1);
  --okg-g2-radius:22px;
  --okg-g2-blur:0px;
  --okg-d1-tint:rgb(0 0 0 / 1);
  --okg-d1-radius:28px;
  --okg-d1-blur:0px;
  --okg-s1-tint:rgb(0 0 0 / 1);
  --okg-s1-radius:12px;
  --okg-s1-blur:0px;
  --okg-s2-tint:rgb(0 0 0 / 1);
  --okg-s2-radius:12px;
  --okg-s2-blur:0px;
  --okg-rim-depth:4px;
  --okg-rim-blur:5px;
  --okg-edge-outer:transparent;
  --okg-edge-lower:transparent;
  --okg-edge-inner:transparent;
  --okg-edge-reflection:transparent;
  --okg-shadow:none;
  color-scheme:dark;
}

/* Material and semantic roles. Legacy layout is contained in okkadio-layout;
   this unlayered contract owns the resulting colours and materials. */
[data-okg-design="strong-glass"], [data-okg-context="portal"], [data-okg-local-context], [data-workspace-kind][data-theme] {
  --bg:var(--okg-canvas); --bg-wash:var(--okg-ambient-a);
  --surface:var(--okg-surface); --surface-raised:var(--okg-raised);
  --surface-soft:var(--okg-accent-soft); --surface-lavender:var(--okg-accent-soft);
  --surface-lilac:var(--okg-accent-soft); --surface-mint:var(--okg-success-surface);
  --surface-peach:var(--okg-warning-surface); --dialog-bg:var(--okg-d1-tint);
  --text:var(--okg-text); --muted:var(--okg-text-muted); --subtle:var(--okg-text-muted);
  --border:var(--okg-border-subtle); --border-strong:var(--okg-text-muted);
  --control-border:var(--okg-text-muted); --focus-color:var(--okg-focus);
  --reading-link:var(--okg-accent); --accent:var(--okg-accent); --accent2:var(--okg-brand);
  --accent-strong:var(--okg-accent); --accent-soft:var(--okg-accent-soft); --soft:var(--okg-accent-soft);
  --green:var(--okg-success); --green-soft:var(--okg-success-surface);
  --amber:var(--okg-warning); --amber-soft:var(--okg-warning-surface);
  --danger:var(--okg-error); --danger-soft:var(--okg-error-surface);
  --action-bg:var(--okg-accent); --action-hover:var(--okg-accent-hover); --action-text:var(--okg-on-accent);
  --home-accent:var(--okg-accent); --home-accent-dark:var(--okg-accent-hover); --home-accent-soft:var(--okg-accent-soft);
  --home-ink:var(--okg-text); --home-muted:var(--okg-text-muted); --home-line:var(--okg-border-subtle);
  --home-bg:var(--okg-canvas); --home-surface:var(--okg-surface); --home-surface-alt:var(--okg-accent-soft);
  --home-night:var(--okg-stage); --home-night-card:var(--okg-g2-tint); --home-night-muted:var(--okg-text-muted);
  --shadow-sm:var(--okg-shadow); --shadow-md:var(--okg-shadow); --shadow-lg:var(--okg-shadow);
  --radius-sm:12px; --radius:22px; --radius-lg:28px;
  --motion-quick:160ms; --motion-ease:cubic-bezier(.22,1,.36,1);
  --okg-type-support:.8125rem; --okg-leading-support:1.45;
  --okg-motion-micro:160ms; --okg-motion-menu:200ms; --okg-motion-dialog:260ms; --okg-motion-story:480ms;
  --okg-stage-legacy:var(--okg-stage); --okg-stage-background:var(--okg-stage);
  --okg-shell-shadow:var(--okg-shadow);
  --okg-surface-filter:none; --okg-g1-filter:none; --okg-g2-filter:none; --okg-d1-filter:none;
  --okg-g1-fill:var(--okg-surface); --okg-g2-fill:var(--okg-surface); --okg-d1-fill:var(--okg-surface);
  --okg-topic-hero-background:var(--okg-surface);
  --okg-rim:inset 1px 1px 0 var(--okg-edge-inner),inset -1px -1px 0 var(--okg-edge-lower),inset var(--okg-rim-depth) var(--okg-rim-depth) var(--okg-rim-blur) -2px var(--okg-edge-reflection),inset calc(-1 * var(--okg-rim-depth)) calc(-1 * var(--okg-rim-depth)) var(--okg-rim-blur) -2px var(--okg-edge-lower),inset 0 5px 4px -3px var(--okg-edge-reflection);
}
html[data-okg-design="strong-glass"] { color:var(--okg-text); background:var(--okg-canvas); scrollbar-color:var(--okg-scrollbar-thumb) var(--okg-scrollbar-track); scrollbar-width:auto; }
body[data-okg-design="strong-glass"] { color:var(--okg-text); background:var(--okg-stage); background-attachment:fixed; }
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  [data-okg-design="strong-glass"], [data-okg-context="portal"], [data-okg-local-context], [data-workspace-kind][data-theme] {
    --okg-g1-fill:var(--okg-g1-tint); --okg-g2-fill:var(--okg-g2-tint); --okg-d1-fill:var(--okg-d1-tint);
    --okg-g1-filter:blur(var(--okg-g1-blur)); --okg-g2-filter:blur(var(--okg-g2-blur)); --okg-d1-filter:blur(var(--okg-d1-blur));
    --okg-topic-hero-background:linear-gradient(var(--okg-g2-fill),var(--okg-g2-fill)),linear-gradient(148deg,var(--okg-stage-3,var(--okg-canvas)) 0%,var(--okg-stage-2,var(--okg-canvas)) 35%,var(--okg-stage-1,var(--okg-canvas)) 70%,var(--okg-stage-0,var(--okg-canvas)) 100%);
  }
}
/* Underlying colour stages are opaque. Nested layout sections are transparent. */
[data-okg-stage="controlled"]:not([data-okg-material]), [data-okg-material="S0"] {
  background:var(--okg-stage); color:var(--okg-text); background-blend-mode:normal;
}
[data-okg-layout="content"] { background:transparent; border:0; box-shadow:none; backdrop-filter:none; }
[data-okg-material] { box-sizing:border-box; min-inline-size:0; color:var(--okg-text); }
[data-okg-material="G1"], [data-okg-material="G2"], [data-okg-material="D1"] {
  border:1px solid var(--okg-edge-outer); border-right-color:var(--okg-edge-lower); border-bottom-color:var(--okg-edge-lower);
  box-shadow:var(--okg-rim),var(--okg-shadow); background-clip:padding-box;
  /* Do not lower parent opacity, recolour product photos or blur text. */
}
[data-okg-material="G1"] { background:var(--okg-g1-fill); border-radius:var(--okg-g1-radius); backdrop-filter:var(--okg-g1-filter); -webkit-backdrop-filter:var(--okg-g1-filter); }
[data-okg-material="G2"] { background:var(--okg-g2-fill); border-radius:var(--okg-g2-radius); backdrop-filter:var(--okg-g2-filter); -webkit-backdrop-filter:var(--okg-g2-filter); }
[data-okg-material="D1"] { background:var(--okg-d1-fill); border-radius:var(--okg-d1-radius); backdrop-filter:var(--okg-d1-filter); -webkit-backdrop-filter:var(--okg-d1-filter); }
/* A portal has a private controlled colour stage: a translucent tint is composed
   over the same bounded, pre-softened gradient. Underlying page text is excluded. */
[data-okg-stage="controlled"][data-okg-material="G1"], [data-okg-backdrop="controlled"][data-okg-material="G1"],
.nav[data-okg-material="G1"], .appbar[data-okg-material="G1"], .bottomnav[data-okg-material="G1"] { background:linear-gradient(var(--okg-g1-fill),var(--okg-g1-fill)),var(--okg-stage); }
[data-okg-stage="controlled"][data-okg-material="G2"], [data-okg-backdrop="controlled"][data-okg-material="G2"] { background:linear-gradient(var(--okg-g2-fill),var(--okg-g2-fill)),var(--okg-stage); }
[data-okg-stage="controlled"][data-okg-material="D1"]:not(dialog), [data-okg-backdrop="controlled"][data-okg-material="D1"]:not(dialog) { background:linear-gradient(var(--okg-d1-fill),var(--okg-d1-fill)),var(--okg-stage); }
/* The modal retains its own readable material. Its backdrop dims the actual
   page instead of repainting a second full gradient over the entire viewport. */
dialog[data-okg-material="D1"]::backdrop { background:rgb(24 34 46 / .30); background:color-mix(in srgb,var(--okg-canvas) 48%,transparent); opacity:1; backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }
dialog[data-okg-material="D1"] { max-height:calc(100dvh - 32px); max-width:calc(100vw - 32px); overflow:auto; overscroll-behavior:contain; scroll-padding-block:20px; background:linear-gradient(var(--okg-d1-fill),var(--okg-d1-fill)),var(--okg-stage); }
/* One modal owns the frame. Its content fits the available inner width;
   focusing a control must not horizontally scroll an oversized inner shell. */
#settingsDialog { width:min(1000px,calc(100vw - 24px)); height:min(760px,calc(100dvh - 32px)); padding:0; overflow:hidden; }
#settingsDialog .settings-shell { width:100%; max-width:100%; height:100%; border:0; border-radius:inherit; box-shadow:none; background:transparent; }
#settingsDialog .settings-header { background:var(--okg-g1-fill); min-width:0; }
#settingsDialog .settings-detail { background:transparent; min-width:0; }
#settingsDialog .settings-card .setting-row { padding-inline:14px; }
@media(max-width:560px) {
  #settingsDialog.show-detail .settings-nav { visibility:hidden; }
}
dialog[data-okg-material="D1"] .message-dialog-text[data-okg-material="S1"] { background:var(--okg-surface); background:color-mix(in srgb,var(--okg-surface) 88%,var(--okg-accent-soft)); padding:14px 16px; font-size:1rem; line-height:1.5; }
dialog[data-okg-material="D1"].is-error .message-dialog-text[data-okg-material="S1"] { background:var(--okg-error-surface); color:var(--okg-error); }
dialog[data-okg-reduced-transparency="true"]::backdrop,
dialog[data-theme="contrast"]::backdrop { background:var(--okg-canvas); backdrop-filter:none; -webkit-backdrop-filter:none; }
[data-okg-material="S1"], [data-okg-read-floor], .okg-reading-core {
  background:var(--okg-surface); color:var(--okg-text); border-radius:12px;
  backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none;
}
[data-okg-material="S2"] { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-text-muted); border-radius:12px; backdrop-filter:none; }
/* Individual fields and data regions are protected; glass headers and gutters stay clear. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), textarea, select, .select-trigger {
  background:var(--okg-surface); color:var(--okg-text); border:1px solid var(--okg-text-muted); border-radius:12px;
  font-size:1rem; font-weight:400; line-height:1.45;
}
input::placeholder, textarea::placeholder { color:var(--okg-text-muted); opacity:1; }
input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color:var(--okg-accent); }
input[type="range"] { min-height:44px; }
input[type="file"]::file-selector-button { color:var(--okg-on-accent-soft); background:var(--okg-accent-soft); border:1px solid var(--okg-text-muted); border-radius:10px; padding:.55rem .75rem; margin-inline-end:.75rem; font:inherit; }
input:autofill { color:var(--okg-text); background:var(--okg-surface); }
select option { color:var(--okg-text); background:var(--okg-surface); }
.primary, .btn, .homepage-primary, .primary-nav-action, .registerlink, .demo-replay {
  background:var(--okg-accent); color:var(--okg-on-accent); border:1px solid var(--okg-accent);
  font-weight:600; font-size:1rem; line-height:1.4;
}
.primary:hover, .btn:hover, .homepage-primary:hover, .primary-nav-action:hover, .registerlink:hover, .demo-replay:hover { background:var(--okg-accent-hover); border-color:var(--okg-accent-hover); color:var(--okg-on-accent); }
.primary:active, .btn:active, .homepage-primary:active { background:var(--okg-accent-active); }
.secondary, .textbtn, .buttonlink, .oauth-button {
  color:var(--okg-text); background:var(--okg-surface); border:1px solid var(--okg-text-muted); border-radius:12px;
  font-size:1rem; font-weight:600; line-height:1.4;
}
.secondary:hover, .textbtn:hover { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); }
/* Public actions use the shared glass material in every colour scheme. */
.homepage-secondary, .public-menu-toggle, .platform-store-button, .site-popover-heading button {
  color:var(--okg-text); background:var(--okg-g1-fill);
  border:1px solid var(--okg-edge-outer); border-right-color:var(--okg-edge-lower); border-bottom-color:var(--okg-edge-lower);
  border-radius:12px; background-clip:padding-box; box-shadow:var(--okg-rim);
  backdrop-filter:var(--okg-g1-filter); -webkit-backdrop-filter:var(--okg-g1-filter);
}
.homepage-secondary {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:48px; padding:10px 16px; max-width:100%;
  font-size:1rem; font-weight:600; line-height:1.4; text-align:center;
  text-decoration:none; overflow-wrap:anywhere;
}
.homepage-secondary>span { flex-shrink:0; }
.public-menu-toggle { min-height:44px; padding:8px 12px; font-weight:600; line-height:1.4; }
.platform-store-button { min-height:54px; padding:10px 12px; gap:9px; }
.platform-store-button span { gap:3px; min-width:0; }
.platform-store-button small { color:var(--okg-text-muted); font-size:.75rem; font-weight:400; line-height:1.2; }
.platform-store-button strong { color:var(--okg-text); font-size:1rem; font-weight:600; line-height:1.2; }
.site-popover-heading button { min-width:44px; width:44px; height:44px; font-size:1.25rem; }
.homepage-secondary:hover, .public-menu-toggle:hover, .platform-store-button:hover, .site-popover-heading button:hover {
  color:var(--okg-on-accent-soft); background:var(--okg-accent-soft); border-color:var(--okg-text-muted);
}
.homepage-secondary:focus-visible, .public-menu-toggle:focus-visible, .platform-store-button:focus-visible, .site-popover-heading button:focus-visible {
  outline:3px solid var(--okg-focus); outline-offset:3px;
}
.primary.danger,.secondary.danger,.textbtn.danger,.btn.danger { color:var(--okg-error); background:var(--okg-error-surface); border-color:var(--okg-error); }
.primary.danger:hover,.secondary.danger:hover,.textbtn.danger:hover,.btn.danger:hover { color:var(--okg-error); background:var(--okg-error-surface); box-shadow:inset 0 0 0 1px var(--okg-error); }
.info,.info-icon,.info-button { color:var(--okg-text); background:var(--okg-g1-fill); border-color:var(--okg-text-muted); }
a { color:var(--okg-accent); }
.nav a, .nav button, .appbar a, .appbar button, .bottomnav button, .settings-nav button, .business-nav button { color:var(--okg-text); }
.nav .registerlink, .appbar .primary { color:var(--okg-on-accent); }
.nav .nav-action-short { display:none; }
.links, .loginlink, .brandsub, .brand-caption, .muted, .hint, .field-hint, .field-guidance, .select-menu-hint, .field-guidance-extra, small { color:var(--okg-text-muted); }
.nav .links, .nav .loginlink, .settings-nav button, .business-nav button { font-size:.9375rem; font-weight:500; }
.eyebrow, .section-kicker, .brand-word, .homepage-hero h1 strong, .headline-accent { color:var(--okg-brand); }
:focus-visible { outline:3px solid var(--okg-focus); outline-offset:3px; }
.select-option { color:var(--okg-text); font-size:1rem; line-height:1.45; font-weight:400; border-radius:12px; }
.select-option:hover, .select-option:focus-visible, .select-option[aria-selected="true"], [role="tab"][aria-selected="true"], .settings-nav button.active, .business-nav button.active {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-text-muted);
}
.select-option[aria-selected="true"], .settings-nav button.active, .business-nav button.active { font-weight:600; }
button:disabled, button[aria-disabled="true"], input:disabled, select:disabled { background:var(--okg-disabled-surface); color:var(--okg-disabled-text); opacity:1; cursor:not-allowed; }
.error, .error-message, .field-error, [data-status="error"], .hint.error { color:var(--okg-error); background:var(--okg-error-surface); border-radius:10px; }
.success, .status-success, [data-status="success"] { color:var(--okg-success); background:var(--okg-success-surface); border-radius:10px; }
.warning, .status-warning, [data-status="warning"] { color:var(--okg-warning); background:var(--okg-warning-surface); border-radius:10px; }
.status-info, [data-status="info"] { color:var(--okg-info); background:var(--okg-info-surface); border-radius:10px; }
.setting-row small, .setting-row .muted, .push-status, .okg-status-copy { font-size:.875rem; font-weight:400; line-height:1.5; }
.settings-detail, .business-detail { padding:20px; }
/* Secondary cards keep translucent material but a quieter edge than their
   containing frame. Repeated broad white rims conceal the intended hierarchy. */
:is(.motion-story,.decision-library,.settings-shell) :is(.plan-card,.story-product,.story-copy,.settings-card,.empty-state) {
  --okg-rim:inset 0 1px 0 var(--okg-edge-inner),inset 0 -1px 0 var(--okg-edge-lower);
  --okg-shadow:0 7px 18px -12px var(--okg-edge-lower);
}
.setting-row { padding:16px; gap:16px; }
.settings-nav, .business-nav { gap:6px; }
.settings-nav button, .business-nav button { min-height:44px; padding:10px 12px; border-radius:12px; }
.settings-grid, .business-workspace { gap:16px; }
.settings-detail h3, .business-detail h3 { color:var(--okg-text); }
.settings-detail p, .business-detail p { color:var(--okg-text-muted); }
.nav, .appbar, .bottomnav { border-radius:0 0 20px 20px; }
.bottomnav { border-radius:20px 20px 0 0; padding-bottom:max(8px,env(safe-area-inset-bottom)); }
.appbar { z-index:50; }
.nav { z-index:100; }
[data-theme="light"] { --okg-logo-filter:none; }
[data-theme="dark"], [data-theme="contrast"] { --okg-logo-filter:brightness(0) invert(1); }
/* Source logos already contain alpha. Only the brand mark, never product photos,
   gets a monochrome light treatment on dark backgrounds. */
.brandlogoimg, .brand-lockup img, .auth-brand .logo, .footerbrand img {
  background:transparent; border-radius:0; padding:0; filter:var(--okg-logo-filter,none);
}
.homepage-hero { border-bottom:1px solid var(--okg-border-subtle); }
/* Topic introductions retain their geometry while using the same bounded
   palette as their page. Reversed stage stops separate this chapter visually;
   no legacy white/lilac paint or unrelated colour is introduced in dark mode. */
.topic-page .contenthero {
  background:var(--okg-topic-hero-background); color:var(--okg-text);
  border-color:var(--okg-edge-outer); border-right-color:var(--okg-edge-lower); border-bottom-color:var(--okg-edge-lower);
  border-radius:var(--okg-g2-radius); box-shadow:var(--okg-rim),var(--okg-shadow);
  backdrop-filter:var(--okg-g2-filter); -webkit-backdrop-filter:var(--okg-g2-filter);
}
.topic-page .contenthero h1 { color:var(--okg-text); }
.topic-page .contenthero .contentlead { color:var(--okg-text-muted); }
.topic-page .contenthero::after { background:var(--okg-g1-fill); border-color:var(--okg-edge-outer); box-shadow:var(--okg-rim); }
.homepage-hero-copy { color:var(--okg-text); }
.homepage-hero-copy>p, .homepage-hero-copy .lead, .hero-proof-line { color:var(--okg-text-muted); }
.homepage-hero-grid { gap:36px; }
.homepage-section, .homepage-final, .homepage-business, .editorial-section { color:var(--okg-text); }
.homepage-section h2, .homepage-final h2, .homepage-business h2, .editorial-section h2, .contentcard h1, .legalcard h1 { color:var(--okg-text); }
.homepage-section p, .homepage-business p, .homepage-final p, .topic-box p { color:var(--okg-text-muted); }
.homepage-pricing table, .pricing-table, .comparison-table, .pricing-comparison { background:var(--okg-surface); color:var(--okg-text); border-radius:12px; }
.homepage-pricing th, .homepage-pricing td, .pricing-table th, .pricing-table td { color:var(--okg-text); border-color:var(--okg-border-subtle); }
.homepage-pricing thead, .pricing-table thead { background:var(--okg-accent-soft); }
.homepage-pricing th, .pricing-table th { color:var(--okg-on-accent-soft); }
.editorial-scenario { display:grid; gap:20px; align-items:center; padding:24px; }
.okg-topic-scene, .okg-business-scene { margin:0; min-width:0; }
.okg-topic-scene img, .okg-business-scene img { display:block; width:100%; height:auto; max-height:390px; object-fit:contain; border-radius:16px; }
.okg-topic-scene figcaption, .okg-business-scene figcaption { color:var(--okg-text-muted); font-size:.875rem; padding:10px 12px; background:var(--okg-surface); border-radius:12px; margin-top:10px; }
.okg-topic-map { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-block:16px; }
.okg-topic-map>* { padding:10px 14px; min-width:0; border-radius:14px; border:1px solid var(--okg-edge-outer); background:var(--okg-g1-fill); box-shadow:var(--okg-rim); }
.okg-reading-core { padding:clamp(16px,3vw,28px); }
.okg-reading-core> :first-child { margin-top:0; }
.okg-reading-core> :last-child { margin-bottom:0; }
.okg-reading-core a { text-decoration:underline; text-underline-offset:.16em; }
.faq-item, .okg-help-topic { margin-block:12px; padding:16px 20px; }
.faq-item summary, .okg-help-topic summary { cursor:pointer; min-height:44px; display:list-item; font-weight:600; padding-block:8px; }
.faq-item summary::marker, .okg-help-topic summary::marker { color:var(--okg-accent); }
.okg-help-answer { padding:14px 16px; margin-top:10px; }
.okg-help-contact { padding:20px; margin-top:20px; }
.editorial-section { padding:clamp(18px,3vw,30px); margin-block:22px; }
.topic-box { padding:20px; }
.legalcard { padding:24px; }
/* The illustrative phone follows the surrounding theme in every station.
   Its bounded colour stage is opaque; dense content has local reading floors. */
.motion-ui .phone-demo-screen { background:var(--okg-stage); color:var(--okg-text); }
.phone-demo-step { background:transparent; color:var(--okg-text); }
.phone-demo-top>b, .phone-demo-step>h3,
.demo-field strong, .demo-person strong, .demo-profile strong,
.demo-detail strong, .demo-result strong, .demo-result b { color:var(--okg-text); }
.phone-demo-top>span, .phone-demo-step>p,
.demo-calendar-label, .demo-calendar-overview, .demo-calendar-weekdays,
.demo-calendar-row small, .demo-field small, .demo-person small,
.demo-profile small, .demo-detail span, .demo-result small,
.phone-example-label, .phone-step-hint, .phone-demo-position { color:var(--okg-text-muted); }
.phone-demo-top>i {
  background:var(--okg-g1-fill); color:var(--okg-text);
  border-color:var(--okg-text-muted); box-shadow:var(--okg-rim);
}
.demo-field, .demo-person, .demo-profile, .demo-detail, .demo-result {
  background:var(--okg-surface); color:var(--okg-text); border-color:var(--okg-border-subtle);
}
.demo-person.is-selected { color:var(--okg-text); border-color:var(--okg-accent); }
.demo-person>b, .demo-profile>b, .demo-chips span, .demo-product-mark {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft);
}
.demo-person>i, .demo-complete-mark, .proof-icon-done {
  background:var(--okg-success-surface); color:var(--okg-success);
}
.demo-notice, .demo-hint {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-text-muted);
}
.demo-notice :is(strong,span), .demo-hint :is(b,span) { color:var(--okg-on-accent-soft); }
.demo-primary-action { background:var(--okg-accent); color:var(--okg-on-accent); }
.demo-calendar-overview strong { color:var(--okg-accent); }
.demo-calendar-row>span { background:var(--okg-surface); color:var(--okg-text); border-color:var(--okg-border-subtle); }
.demo-calendar-row .is-outside { background:var(--okg-canvas); color:var(--okg-text-muted); font-weight:400; }
.demo-calendar-row .is-selected, .demo-calendar-row .is-selected small {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-accent);
}
.demo-tap { border-color:var(--okg-accent); }
.demo-calendar-row .has-event::after, .demo-calendar-events i { background:var(--okg-accent); }
.demo-calendar-row .event-business::after, .demo-calendar-events i.event-business { background:var(--okg-success); }
.demo-calendar-row .event-anniversary::after, .demo-calendar-events i.event-anniversary { background:var(--okg-warning); }
.demo-calendar-events>span { background:var(--okg-surface); color:var(--okg-text); }
.demo-calendar-events strong { color:var(--okg-text); }
.demo-calendar-events small { color:var(--okg-text-muted); }
.demo-calendar-events .is-focus { background:var(--okg-accent); color:var(--okg-on-accent); }
.demo-calendar-events .is-focus :is(strong,small) { color:var(--okg-on-accent); }
.demo-calendar-events .is-focus i { background:var(--okg-on-accent); }
.phone-demo-nav { background:var(--okg-surface); color:var(--okg-text-muted); border-color:var(--okg-border-subtle); }
.phone-demo-controls button, .phone-demo-controls .phone-stations button {
  background:var(--okg-g1-fill); color:var(--okg-text); border-color:var(--okg-text-muted);
  box-shadow:var(--okg-rim); font-size:.8125rem; min-height:44px; min-width:44px;
}
.phone-demo-controls button:is(:hover,:focus-visible),
.phone-demo-controls .phone-stations button[aria-pressed="true"] {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-accent);
}
.phone-demo-controls button:is([data-state="play"],[data-state="replay"]) {
  background:var(--okg-accent); color:var(--okg-on-accent); border-color:var(--okg-accent);
}
.phone-playback { display:flex; align-items:center; justify-content:center; gap:8px; max-width:100%; }
.phone-demo-controls button[data-phone-next] {
  background:var(--okg-accent); color:var(--okg-on-accent); border-color:var(--okg-accent);
}
.phone-demo-controls button[data-phone-toggle] {
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 44px; width:44px; height:44px; padding:0;
  background:transparent; color:var(--okg-text-muted); border-color:transparent;
  box-shadow:none; font-size:1rem;
}
.phone-demo-controls button[data-phone-toggle]:is(:hover,:focus-visible) {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-border-subtle);
}
.phone-demo-controls button[data-phone-toggle][hidden] { display:none; }
.phone-demo-controls button:disabled {
  background:var(--okg-disabled-surface); color:var(--okg-disabled-text); box-shadow:none;
}
.proof-callout { opacity:1; }
.proof-callout.is-active { border-color:var(--okg-accent); }
/* The adjacent live criteria illustration had the same inherited light-only
   colours, including its empty-result state and selected interest. */
.criteria-demo :is(h3,h4,legend), .criteria-fixed strong { color:var(--okg-text); }
.criteria-demo :is(.criteria-intro,.criteria-control-hint),
.criteria-fixed>span, .criteria-fixed small, .criteria-result p { color:var(--okg-text-muted); }
.criteria-demo .example-badge { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); }
.criteria-budget output, .criteria-result .example-price { color:var(--okg-text); }
.criteria-demo .segmented-control label { background:var(--okg-surface); color:var(--okg-text); border-color:var(--okg-text-muted); }
.criteria-demo .segmented-control label:has(input:checked) {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-accent);
}
.criteria-demo .segmented-control input, .criteria-budget input { accent-color:var(--okg-accent); }
.criteria-fixed, .criteria-result, .criteria-result .example-change { border-color:var(--okg-border-subtle); }
.criteria-result, .example-product-placeholder { background:var(--okg-surface); color:var(--okg-text); }
.criteria-result .example-change { color:var(--okg-text-muted); }
@keyframes criteriaConnection { 50% { box-shadow:0 0 0 3px var(--okg-accent-soft); border-radius:12px; } }
.demo-saved-product { display:block; width:120px; height:96px; object-fit:contain; margin:8px auto; border-radius:12px; background:var(--okg-surface); }
.product-media, .product-image, .product-image-wrap, .product-image-frame, .product-card img, .productcard img, .product-picture img, .quick-product img, .product-preview img, #productDetails img {
  object-fit:contain; filter:none; opacity:1;
}
.product-media, .product-image-wrap, .product-image-frame { background:var(--okg-raised); border-radius:14px; overflow:hidden; }
.product-card, .productcard, .quick-product-card { transition:box-shadow 180ms var(--motion-ease),border-color 180ms var(--motion-ease); }
.product-card:hover, .productcard:hover, .quick-product-card:hover, .product-card:focus-within, .productcard:focus-within { border-color:var(--okg-edge-outer); box-shadow:var(--okg-rim),var(--okg-shadow); }
.okg-image-unavailable { min-height:90px; color:var(--okg-text-muted); background:var(--okg-surface); object-fit:contain; }
.empty-state { text-align:center; }
.okg-empty-illustration { display:block; width:112px; height:112px; object-fit:contain; margin:0 auto 12px; }
.okg-glass-ribbon { position:absolute; pointer-events:none; width:min(52vw,680px); height:auto; object-fit:contain; z-index:0; }
.homepage-hero .okg-glass-ribbon { right:-7%; top:0; opacity:.9; }
.homepage-hero-grid, .scenario-story { position:relative; }
.homepage-hero-grid>*:not(.okg-glass-ribbon) { position:relative; z-index:1; }
.homepage-hero,.homepage-pricing,.sitefooter,.footer,.cogift-footer,.auth-shell { position:relative; }
.homepage-hero,.homepage-pricing,.auth-shell { overflow:clip; }
.auth-shell .okg-auth-ribbon { right:-8%; bottom:-14%; width:min(58vw,760px); z-index:0; }
.auth-shell .auth-card { position:relative; z-index:1; }
/* A quiet local continuation of the content-anchored public band. */
.auth-shell .okg-auth-band { position:absolute; inset:0 -20% auto auto; width:min(95vw,1000px); height:100%; min-height:640px; pointer-events:none; z-index:0; overflow:visible; }
.okg-auth-band .auth-band-edge,.okg-auth-band .auth-band-return { fill:none; stroke:var(--okg-edge-reflection); stroke-width:2; vector-effect:non-scaling-stroke; }
.okg-auth-band .auth-band-return { stroke:var(--okg-edge-lower); }
[data-okg-reduced-transparency="true"] .okg-auth-band .auth-band-volume { display:none; }
[data-okg-reduced-transparency="true"] .okg-auth-band path { stroke:var(--okg-border-subtle); }
[data-theme="contrast"] .okg-auth-band { display:none; }
@media(max-width:700px) { .auth-shell .okg-auth-band { width:150%; right:-65%; } }
.okg-footer-ribbon { position:absolute; right:0; bottom:0; width:160px; height:120px; object-fit:contain; pointer-events:none; opacity:.65; z-index:0; }
.okg-pricing-ribbon { position:absolute; right:-30px; top:0; width:190px; height:190px; object-fit:contain; pointer-events:none; z-index:0; }
.sitefooter>*:not(.okg-footer-ribbon),.footer>*:not(.okg-footer-ribbon),.cogift-footer>*:not(.okg-footer-ribbon) { position:relative; z-index:1; }
[data-theme="dark"] .okg-auth-ribbon { right:-5%; bottom:-5%; }
[data-theme="dark"] .homepage-hero .okg-glass-ribbon { right:-2%; top:8%; }
.okg-scroll-progress { position:fixed; inset:0 0 auto; height:3px; z-index:1000; background:var(--okg-accent); transform-origin:left; pointer-events:none; }
/* Native scrolling remains native, including system overlay bars and buttons. */
* { scrollbar-width:auto; scrollbar-color:var(--okg-scrollbar-thumb) var(--okg-scrollbar-track); }
*::-webkit-scrollbar { width:revert; height:revert; }
*::-webkit-scrollbar-thumb { background:var(--okg-scrollbar-thumb); border-radius:20px; border:2px solid var(--okg-scrollbar-track); }
*::-webkit-scrollbar-track { background:var(--okg-scrollbar-track); }
*::-webkit-scrollbar-button { display:revert; width:revert; height:revert; }
dialog, .select-menu, .settings-nav, .business-nav, textarea, [data-okg-scroll] { scrollbar-gutter:stable; }
.context-panel { overflow:clip; }
.select-menu, .info-popover, .product-preview, .calendar-event-preview { overflow:auto; }
.select-menu-options { overflow:auto; max-height:inherit; }
.context-panel #contextPanelBody { overscroll-behavior:contain; }
.tab.active, .calendar-filter[aria-pressed="true"], .criteria-chip.active, .status-step.current, .status-step.done,
.calendar-preview-active, .day.today, .day.selected, [data-business-row].is-selected {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-text-muted);
}
.okg-faq-answer { padding:14px 16px; margin-top:10px; }
.cogift-footer { display:flex; flex-wrap:wrap; gap:16px; width:min(1180px,calc(100% - 32px)); margin:24px auto; padding:20px; color:var(--okg-text-muted); }
.cogift-footer a { text-underline-offset:3px; }
.okg-site-preferences { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
.okg-appearance { width:min(620px,100%); margin:20px auto; padding:14px 18px; }
.okg-appearance summary { min-height:44px; padding-block:10px; cursor:pointer; font-weight:600; }
.okg-appearance fieldset { border:0; padding:12px 0 0; margin:0; display:flex; flex-wrap:wrap; gap:14px; }
.okg-appearance legend { font-weight:600; margin-bottom:10px; }
.okg-appearance label { display:grid; gap:6px; flex:1 1 210px; min-width:0; }
.okg-appearance select { width:100%; min-height:44px; }
.okg-appearance [role="status"] { flex-basis:100%; margin:0; color:var(--okg-text-muted); font-size:.875rem; }
.okg-shared-product-image { width:120px; height:96px; object-fit:contain; background:var(--okg-raised); border-radius:12px; }
.okg-shared-product-image img { display:block; width:100%; height:100%; object-fit:contain; }
.no-js .okg-appearance,.no-js #publicQuickSearch,.no-js #cogiftStatus,.no-js .story-controls,.no-js .story-stages { display:none; }
.no-js .nav .links { display:flex; flex-wrap:wrap; }
.no-js .nav { flex-wrap:wrap; height:auto; gap:12px; }
.no-js .nav .menu-toggle { display:none; }
.no-js .okg-help-loading { display:none; }
.okg-person-lens { display:flex; align-items:center; gap:12px; padding:12px 16px; }
.okg-person-lens>span:first-child { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); font-weight:600; }
.site-info-popover::before, .info-popover::before { background:var(--okg-g2-fill); border-color:var(--okg-edge-outer); }
.nav .audience-tasks, .nav .audience-benefit>strong { color:var(--okg-text); }
.nav .audience-benefit p, .nav .audience-section-label { color:var(--okg-text-muted); }
.nav .audience-benefit>.eyebrow { color:var(--okg-brand); }
.nav .audience-tasks>a:hover, .nav .audience-tasks>a:focus-visible,
.nav .audience-secondary a:hover, .nav .audience-secondary a:focus-visible {
  background:var(--okg-accent-soft); color:var(--okg-on-accent-soft);
}
.okg-appearance-previews { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:24px; }
.okg-appearance-preview { padding:20px; border-radius:24px; overflow:hidden; }
.okg-preview-components { display:grid; gap:16px; }
.okg-preview-product, .okg-preview-menu, .okg-preview-window, .okg-preview-bubble { margin:0; padding:16px; }
.okg-preview-product img { display:block; width:100%; height:140px; object-fit:contain; border-radius:12px; }
.okg-preview-menu { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.okg-preview-menu>span { padding:8px; }
.okg-preview-field { display:block; padding:12px; margin-block:10px; border:1px solid var(--okg-text-muted); border-radius:12px; }
.okg-preview-bubble { margin-inline-start:12%; border-bottom-left-radius:6px; }
.okg-preview-label { display:block; font-size:.875rem; font-weight:600; margin-bottom:8px; }
.okg-product-thumb { display:block; flex:0 0 64px; width:64px; height:64px; object-fit:contain; border-radius:12px; background:var(--okg-raised); }
.okg-product-thumb--wide { width:100%; height:144px; margin-bottom:12px; }
.okg-business-context { display:grid; grid-template-columns:minmax(160px,1fr) minmax(0,2fr); gap:20px; padding:20px; margin-block:16px; align-items:center; }
.okg-business-context-media { margin:0; }
.okg-business-context-media img { display:block; width:100%; height:auto; max-height:200px; object-fit:contain; border-radius:14px; }
.okg-business-context-media figcaption { font-size:.875rem; color:var(--okg-text-muted); margin-top:8px; }
.okg-business-context-copy { min-width:0; }
.okg-inline-product { display:flex; align-items:center; gap:12px; margin-block:12px; min-width:0; }
.okg-inline-product>div { min-width:0; }
.okg-inline-product>span { min-width:0; }
.okg-inline-product small { display:block; margin-top:4px; }
.public-select-trigger { background:var(--okg-surface); color:var(--okg-text); border:1px solid var(--okg-text-muted); font-size:1rem; min-height:44px; }
.public-select-option { color:var(--okg-text); font-size:1rem; min-height:44px; }
.public-select-option[aria-selected="true"], .public-select-option:hover { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); }
/* JS owns opening/closing and native focus; no duplicate CSS transform animation. */
[data-okg-state="closing"] { pointer-events:none; }
[data-okg-edge-accent="once"] { animation:okg-edge-once 360ms var(--motion-ease) 1; }
@keyframes okg-edge-once { 50% { box-shadow:inset 1px 1px 0 var(--okg-edge-outer),inset -1px -1px 0 var(--okg-edge-outer),var(--okg-shadow); } }
.primary, .secondary, .textbtn, .btn, .homepage-primary, .homepage-secondary { transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease; }
@media (hover:hover) { .product-media img { transition:transform 180ms var(--motion-ease); } .product-card:hover .product-media img { transform:scale(1.02); } }
@media(max-width:1120px) {
  .nav-ready .links {
    color:var(--okg-text); background:linear-gradient(var(--okg-g2-fill),var(--okg-g2-fill)),var(--okg-stage);
    border-color:var(--okg-edge-outer); box-shadow:var(--okg-rim),var(--okg-shadow);
    backdrop-filter:var(--okg-g2-filter); -webkit-backdrop-filter:var(--okg-g2-filter);
  }
}
@media(max-width:620px) {
  /* One compact row at ordinary mobile text sizes. Wrapping remains a safety
     valve for enlarged system text; no fixed height or clipped controls. */
  .nav.nav-ready .navin {
    width:calc(100% - 16px); min-height:56px; padding:4px 0;
    justify-content:space-between; align-items:center; flex-wrap:wrap; gap:4px;
  }
  .nav.nav-ready .brand {
    flex:1 1 96px; min-width:96px; max-width:126px; min-height:44px;
    margin:0; justify-content:center;
  }
  .nav.nav-ready .brandlogoimg { width:100%; height:auto; max-height:none; }
  .nav.nav-ready .brandsub { display:none; }
  .nav.nav-ready .navright {
    flex:0 1 auto; width:auto; min-width:0; max-width:100%;
    flex-wrap:wrap; justify-content:flex-end; gap:4px;
  }
  .nav.nav-ready .public-menu-toggle, .nav.nav-ready .registerlink,
  .nav.nav-ready .loginlink, .nav.nav-ready .loginbtn {
    min-height:44px; min-width:44px; max-width:100%; padding:8px 4px;
    font-size:.875rem; line-height:1.4;
    display:inline-flex; align-items:center; justify-content:center;
    white-space:normal; overflow-wrap:anywhere; text-align:center;
  }
  .nav.nav-ready .public-menu-toggle, .nav.nav-ready .registerlink { border-radius:12px; }
  .nav.nav-ready .loginbtn { background:transparent; color:var(--okg-text); box-shadow:none; }
  .homepage-actions .homepage-secondary { width:100%; }
}
@media(max-width:360px) {
  /* The full accessible name remains on the link, including its free entry. */
  .nav.nav-ready .nav-action-full { display:none; }
  .nav.nav-ready .nav-action-short { display:inline; }
}
@media(max-width:700px) {
  .auth-shell .okg-auth-ribbon { width:100%; right:-24%; bottom:-8%; }
  .okg-pricing-ribbon { display:none; }
  .okg-footer-ribbon { width:96px; height:80px; }
  .okg-appearance-previews,.okg-business-context { grid-template-columns:1fr; }
  body[data-okg-design="strong-glass"] { background-attachment:scroll; }
  .homepage-hero-grid { gap:22px; }
  .settings-detail, .business-detail, .setting-row { padding:14px; gap:12px; }
  .legalcard { padding:14px; }
  .editorial-scenario { padding:18px; }
  .okg-topic-scene img, .okg-business-scene img { max-height:none; }
  dialog[data-okg-material="D1"] { max-width:calc(100vw - 20px); max-height:calc(100dvh - 20px); border-radius:24px; }
  .homepage-hero .okg-glass-ribbon { width:85%; top:40%; right:-16%; }
}
/* Screenshot correction: pricing-table interiors and business scene controls.
   Insert after the existing homepage/table rules, before accessibility fallbacks.
   In index.html, the .plan-task-comparison wrapper must use material G2 and
   data-okg-backdrop="controlled"; the table keeps a solid local reading surface. */
.plan-task-comparison[data-okg-material="G2"] {
  padding:clamp(14px,2.5vw,24px);
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) table,
table:is(.pricing-table,.comparison-table,.pricing-comparison) {
  background:var(--okg-surface);
  color:var(--okg-text);
  border-color:var(--okg-border-subtle);
  border-radius:16px;
  box-shadow:none;
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) :is(tbody,tfoot,tr,th,td) {
  background:var(--okg-surface);
  color:var(--okg-text);
  border-color:var(--okg-border-subtle);
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) :is(thead,thead tr,thead th,thead td) {
  background:var(--okg-accent-soft);
  color:var(--okg-on-accent-soft);
  border-color:var(--okg-border-subtle);
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) caption {
  color:var(--okg-text);
  background:transparent;
  line-height:1.4;
  padding-block:0 14px;
  margin:0;
  text-align:start;
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) :is(details,summary) {
  color:var(--okg-text);
  background:transparent;
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) summary {
  padding-block:6px;
  line-height:1.5;
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) summary::marker {
  color:var(--okg-accent);
}
:is(.plan-task-comparison,.homepage-pricing,.pricing-table,.comparison-table,.pricing-comparison) details>p,
.plan-task-comparison :is(.plan-availability,.plan-business-note) {
  color:var(--okg-text-muted);
  line-height:1.55;
}
.plan-task-comparison .plan-business-note a {
  color:var(--okg-accent);
}
.plan-task-comparison table {
  table-layout:auto;
}
.plan-task-comparison :is(th,td) {
  vertical-align:top;
  overflow-wrap:anywhere;
}
.plan-task-comparison thead th {
  white-space:normal;
}
.plan-task-comparison> :last-child {
  margin-bottom:0;
}
.scenario-tabs {
  border-color:var(--okg-border-subtle);
}
.scenario-tabs button {
  background:transparent;
  color:var(--okg-text);
  border-color:transparent;
  box-shadow:none;
  min-width:0;
  line-height:1.4;
}
.scenario-tabs button:is(:hover,:focus-visible),
.scenario-tabs button[aria-selected="true"] {
  background:var(--okg-accent-soft);
  color:var(--okg-on-accent-soft);
  border-color:var(--okg-text-muted);
}
.scenario-tabs button[aria-selected="true"] {
  font-weight:600;
  box-shadow:inset 0 -2px 0 var(--okg-accent);
}
.scenario-tabs button:active {
  background:var(--okg-accent);
  color:var(--okg-on-accent);
  border-color:var(--okg-accent);
}
.scenario-tabs button:is(:disabled,[aria-disabled="true"]) {
  background:var(--okg-disabled-surface);
  color:var(--okg-disabled-text);
  border-color:var(--okg-border-subtle);
  box-shadow:none;
  opacity:1;
}
.scenario-story h3,
.scenario-criteria dd {
  color:var(--okg-text);
}
.scenario-story p,
.scenario-criteria dt,
.scenario-boundary {
  color:var(--okg-text-muted);
}
.scenario-criteria {
  background:var(--okg-surface);
  color:var(--okg-text);
  border-color:var(--okg-border-subtle);
}
.scenario-criteria>div,
.scenario-boundary {
  border-color:var(--okg-border-subtle);
}
.scenario-story .example-badge {
  background:var(--okg-accent-soft);
  color:var(--okg-on-accent-soft);
}
:is(.okg-topic-scene,.okg-business-scene) figcaption {
  display:grid;
  gap:4px;
  line-height:1.45;
  overflow-wrap:anywhere;
}
:is(.okg-topic-scene,.okg-business-scene) figcaption>strong {
  display:block;
  color:var(--okg-text);
}
:is(.okg-topic-scene,.okg-business-scene) figcaption>span {
  display:block;
  color:var(--okg-text-muted);
}
.scenario-story>.okg-business-product {
  margin-bottom:16px;
}
@media(max-width:620px) {
  .scenario-tabs button {
    font-size:.875rem;
    min-height:48px;
    padding:9px 6px;
  }
  .scenario-panel {
    min-height:0;
  }
  :is(.okg-topic-scene,.okg-business-scene) figcaption {
    padding:10px 12px;
  }
}
@media(max-width:420px) {
  .plan-task-comparison :is(th,td) {
    padding:12px 6px;
    font-size:.875rem;
    line-height:1.5;
  }
}

/* QA3: explanatory content uses a bounded glass reading panel. Solid fields,
   dense tables and original photo backgrounds retain their own reading floor. */
.motion-story .story-copy[data-okg-material="G1"] {
  border-radius:18px;
  align-self:start;
  justify-content:flex-start;
  /* The controlled gradient is pre-softened; no extra nested filter is needed. */
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.criteria-result[data-okg-material="G1"] {
  background:linear-gradient(var(--okg-g1-fill),var(--okg-g1-fill)),var(--okg-stage);
  border-radius:18px;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.criteria-result-text[data-okg-layout="content"] { background:transparent; }

/* Mobile story copy: compact related content without changing desktop geometry.
   QA3 replaces the old 660px guess with the measured longest mobile chapter. */
@media (max-width:700px) {
  .motion-story .story-copy {
    min-height:0;
    padding:12px;
    justify-content:flex-start;
    gap:0;
  }

  .motion-story .story-topline { gap:6px 10px; margin-bottom:12px; }
  .motion-story .story-stages { margin-bottom:14px; }

  body .motion-story .story-copy h3 {
    margin:0 0 8px;
  }

  body .motion-story .story-copy>p:not(.story-boundary) {
    margin:0;
    line-height:1.5;
  }

  .motion-story .story-facts {
    min-height:0;
    margin:8px 0 0;
    gap:8px;
    align-content:start;
  }

  .motion-story .story-facts>div {
    min-height:0;
    padding-top:8px;
    row-gap:3px;
    column-gap:10px;
    align-content:start;
  }

  .motion-story .story-facts dt,
  .motion-story .story-facts dd {
    margin:0;
    line-height:1.45;
  }

  body :is(.cost-notice,.public-cost-notice) { font-size:.875rem; line-height:1.5; font-weight:500; color:var(--okg-warning); }
body .motion-story .story-copy .story-boundary {
    margin:10px 0 0;
    line-height:1.45;
  }

  .motion-story .story-topic-link {
    margin-top:8px;
    min-height:44px;
    display:inline-flex;
    align-items:center;
    padding-block:6px;
  }

  .motion-story .story-controls {
    margin-top:12px;
    padding-top:12px;
    gap:8px 12px;
  }

  body .motion-story .story-stages button,
  body .motion-story .story-controls button,
  body .motion-story .story-dismiss {
    min-height:44px;
  }
}

/* Only the narrow public layout is condensed. Desktop spacing and text sizes
   remain intact; reading content grows naturally instead of filling a reserve. */
@media (max-width:620px) {
  .home-redesign .homepage-section { padding-block:46px; }
  .home-redesign .homepage-hero-grid { padding-block:32px 28px; gap:24px; }
  .home-redesign .closing-section { padding-top:28px; }
  .home-redesign .journey-list { margin-bottom:22px; }
  .home-redesign .journey-list li { padding-block:17px; }
  .home-redesign .redesigned-search .quick-search-grid { gap:24px; }
  .home-redesign .trust-list { margin-top:28px; }
  .home-redesign .trust-list article { padding:18px 0; }
  .home-redesign .trust-list article>div { padding-right:50px; }
  .home-redesign .trust-list article .info { top:12px; right:0; width:44px; height:44px; }
  .home-redesign .trust-list article>p { margin-top:10px; }
  .home-redesign .criteria-scene { margin-top:18px; gap:16px; }
  .home-redesign .criteria-budget { margin-top:16px; }
  .home-redesign .criteria-result-text { min-height:0; padding:14px; }
  .home-redesign .criteria-result h4 { min-height:0; margin-block:8px; }
  .home-redesign .criteria-result-text>[data-example-reason] { min-height:0; margin-top:10px; }
  .home-redesign .criteria-result .example-change { min-height:0; margin-top:10px; padding-top:10px; }
  .home-redesign .example-product-placeholder { height:auto; min-height:112px; padding:16px; }
}

/* QA5: small visual information marks keep a 44px pointer/keyboard target.
   The ring is 24px across; the transparent surround is intentionally clickable. */
.info, .info-icon, button.info-button {
  display:inline-grid; place-items:center; flex:0 0 44px;
  width:44px; height:44px; min-width:44px; min-height:44px; padding:0;
  position:relative; top:auto; margin:0; vertical-align:middle;
  border:0; border-radius:50%; box-shadow:none;
  font-size:.8125rem; font-weight:600; line-height:1; color:var(--okg-text);
  background:radial-gradient(circle at center,var(--okg-g1-fill) 0 11px,var(--okg-text-muted) 11px 12px,transparent 12px);
}
.info:hover, .info-icon:hover, button.info-button:hover,
.info[aria-expanded="true"], .info-icon[aria-expanded="true"] {
  color:var(--okg-on-accent-soft);
  background:radial-gradient(circle at center,var(--okg-accent-soft) 0 11px,var(--okg-accent) 11px 12px,transparent 12px);
}
.info:focus-visible, .info-icon:focus-visible, button.info-button:focus-visible {
  outline:3px solid var(--okg-focus); outline-offset:1px;
}
.site-info-popover {
  width:min(350px,calc(100vw - 24px)); max-height:min(440px,calc(100dvh - 24px));
  padding:0; font-size:.875rem; line-height:1.5; border-radius:20px;
  color:var(--okg-text); overflow-wrap:anywhere; overscroll-behavior:contain;
  display:grid; grid-template-rows:auto minmax(0,1fr); overflow:visible;
}
.site-popover-heading {
  padding:12px 12px 0 16px; margin:0; gap:8px; align-items:flex-start;
}
.site-popover-heading strong { font-size:1rem; line-height:1.4; padding-block:8px; font-weight:600; }
.site-popover-heading button {
  border:0; border-radius:50%; box-shadow:none; background:transparent;
  min-width:44px; width:44px; height:44px; flex:none;
  padding:0; font-size:1.25rem; line-height:1; color:var(--okg-text-muted);
}
.site-popover-heading button:hover { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); }
.site-info-popover .site-popover-reading {
  padding:8px 16px 16px; border:0; border-radius:0;
  background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none;
  font-size:.875rem; line-height:1.5; color:var(--okg-text);
  min-height:0; overflow:auto; overscroll-behavior:contain;
}
.site-info-popover .site-popover-reading :is(p,li,a) { font-size:inherit; line-height:inherit; }
.site-info-popover .site-popover-reading p { margin:0 0 8px; }
.site-info-popover .site-popover-reading ul { padding-inline-start:20px; margin:8px 0; }
.site-info-popover .site-popover-reading li+li { margin-top:4px; }
.site-info-popover .site-popover-reading>:last-child { margin-bottom:0; }
.site-info-popover .dialoglink { min-height:44px; padding-block:8px; }
.site-info-popover[data-placement="above"]::before { top:auto; bottom:-6px; transform:rotate(225deg); }
.site-info-popover[data-placement="below"]::before { top:-6px; bottom:auto; transform:rotate(45deg); }
/* Supporting product facts are deliberately quieter than the price, product
   title, payment controls and error text. Text remains opaque and wraps fully. */
body :is(.disclosure-note,.product-notice,.source-note,
  .criteria-intro,.example-change,.story-boundary,.story-example,.phone-example-label),
body .site-popover-reading .disclosure-note,
body .public-product-meta>span,
body .product-meta.disclosure-note>:is(span,small),
body :is(.okg-topic-scene,.okg-business-scene,.story-product,.story-static-product) figcaption>span {
  color:var(--okg-text-muted); font-size:var(--okg-type-support);
  font-weight:400; line-height:var(--okg-leading-support); letter-spacing:normal;
  opacity:1; white-space:normal; overflow-wrap:anywhere;
}
body :is(.disclosure-note,.product-notice,.source-note) {
  margin-block:6px 0;
}
body :is(.cost-notice,.public-cost-notice) { font-size:.875rem; line-height:1.5; font-weight:500; color:var(--okg-warning); }
body .motion-story .story-copy .story-boundary { font-size:var(--okg-type-support); line-height:var(--okg-leading-support); color:var(--okg-text-muted); }
body .example-badge {
  color:var(--okg-on-accent-soft); background:var(--okg-accent-soft);
  font-size:var(--okg-type-support); line-height:var(--okg-leading-support);
  font-weight:500; letter-spacing:normal; padding:3px 7px;
}
/* Old topic accents must not reintroduce white/pink interiors in Aeria/Graphit.
   All topic markers keep a consistent theme accent; their symbols carry meaning. */
.topic-slider-controls>span, .topic-slide p { color:var(--okg-text-muted); }
.topic-slide { --topic-accent:var(--okg-accent); --topic-soft:var(--okg-accent-soft); --topic-tag:var(--okg-accent-soft); }
.topic-slide .topic-symbol { background:var(--okg-accent); color:var(--okg-on-accent); }
.topic-slide>small { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); }
.topic-slide:hover { background:var(--okg-g2-fill); color:var(--okg-text); }
.topic-slider-controls button { background:var(--okg-g1-fill); color:var(--okg-text); border-color:var(--okg-text-muted); box-shadow:var(--okg-rim); }
.topic-slider-controls button:hover { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); border-color:var(--okg-accent); }
.topic-slider-controls button:disabled { background:var(--okg-disabled-surface); color:var(--okg-disabled-text); opacity:1; box-shadow:none; }
/* Aeria and Graphit use neutral optical edges. No image recolouring is applied. */
[data-color-world="graphit"][data-theme="light"] { --okg-logo-filter:grayscale(1); }
.public-color-world { display:grid; gap:6px; min-width:0; }
.public-color-world :is(select,.public-select-trigger) { min-height:44px; }
.nav .public-appearance-open {
  display:inline-flex; align-items:center; min-height:44px; padding:8px;
  border:0; border-radius:12px; background:transparent; box-shadow:none;
  color:var(--okg-text); font:inherit; line-height:1.4; cursor:pointer;
}
.nav .public-appearance-open:hover { background:var(--okg-accent-soft); color:var(--okg-on-accent-soft); }
dialog.okg-appearance.public-appearance-dialog {
  width:min(560px,calc(100vw - 24px)); max-width:calc(100vw - 24px);
  max-height:calc(100dvh - 24px); margin:auto; padding:16px;
}
.public-appearance-dialog .site-popover-heading { padding:0; align-items:center; }
.public-appearance-dialog .site-popover-heading h2 { margin:0; font-size:1.25rem; line-height:1.3; letter-spacing:-.01em; }
.public-appearance-dialog fieldset { padding-top:12px; gap:12px; }
.public-appearance-dialog legend { font-size:1rem; line-height:1.4; }
@media(max-width:620px) {
  .home-redesign .journey-list { margin-top:24px; }
  .home-redesign .journey-list li { padding-block:16px; gap:12px; }
  .home-redesign .journey-list li:first-child { padding-top:0; }
  .home-redesign .difference-grid, .home-redesign .criteria-layout,
  .home-redesign .business-panel { gap:24px; }
  .home-redesign .use-case-grid { margin-top:24px; }
  .home-redesign .value-story-grid { margin-block:24px; gap:24px; }
  .home-redesign .narrative-thread { height:40px; gap:12px; }
  .home-redesign .quick-trust, .home-redesign .public-results { margin-top:24px; }
  .home-redesign .public-results-head { margin-bottom:16px; }
  .home-redesign .trust-list { margin-top:24px; margin-bottom:20px; }
  .home-redesign .trust-list article { min-height:0; }
  .home-redesign .trust-list article:first-child { padding-top:16px; }
  .home-redesign .trust-list article>div { padding-right:44px; }
  .home-redesign .business-scenario { margin-top:24px; }
  .home-redesign .scenario-tabs { padding-bottom:14px; }
  .home-redesign .scenario-panel { padding-top:16px; gap:16px; }
  .home-redesign .scenario-boundary { margin-top:16px; padding-top:12px; }
  .home-redesign .plan-task-comparison { margin-top:24px; }
  .home-redesign .closing-panel { gap:20px; padding:20px; }
  .home-redesign .redesigned-footer { padding-block:32px; }
  .home-redesign .redesigned-footer .footergrid { gap:24px; }
}

/* A local or portalled context also matches the two-attribute enhancement rule.
   Its explicit accessibility choice must win that cascade, not only inherit
   from the document root. Keep the opaque baseline when blur is unsupported. */
[data-okg-reduced-transparency="true"],
[data-okg-reduced-transparency="true"][data-workspace-kind][data-theme],
[data-theme="contrast"], [data-theme="contrast"][data-workspace-kind] {
  --okg-g1-fill:var(--okg-surface); --okg-g2-fill:var(--okg-surface); --okg-d1-fill:var(--okg-surface);
  --okg-topic-hero-background:var(--okg-surface);
  --okg-g1-filter:none; --okg-g2-filter:none; --okg-d1-filter:none; --okg-rim:inset 0 0 0 transparent;
}
[data-okg-reduced-transparency="true"][data-okg-material], [data-theme="contrast"][data-okg-material],
[data-okg-reduced-transparency="true"] [data-okg-material], [data-theme="contrast"] [data-okg-material] { box-shadow:none; border-color:var(--okg-border-strong); }
[data-okg-reduced-transparency="true"] .okg-glass-ribbon, [data-theme="contrast"] .okg-glass-ribbon { display:none; }
[data-okg-reduced-transparency="true"] :is(.okg-footer-ribbon,.okg-pricing-ribbon), [data-theme="contrast"] :is(.okg-footer-ribbon,.okg-pricing-ribbon) { display:none; }
[data-okg-reduced-transparency="true"] .contenthero, [data-theme="contrast"] .contenthero { box-shadow:none; border-color:var(--okg-border-strong); }
[data-okg-reduced-transparency="true"] .contenthero::after, [data-theme="contrast"] .contenthero::after { display:none; }
[data-theme="contrast"] [data-okg-stage], [data-theme="contrast"][data-okg-design] { background:var(--okg-canvas); }
[data-okg-reduced-motion="true"] *, [data-okg-reduced-motion="true"] *::before, [data-okg-reduced-motion="true"] *::after { scroll-behavior:auto; animation:none; transition:none; }
[data-okg-reduced-motion="true"] .product-media img { transform:none; }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } .product-media img { transform:none!important; } }
@media(prefers-reduced-transparency:reduce) {
  .okg-auth-band .auth-band-volume { display:none; }
  dialog[data-okg-material="D1"]::backdrop { background:var(--okg-canvas); backdrop-filter:none; -webkit-backdrop-filter:none; }
  [data-okg-design], [data-okg-context], [data-workspace-kind][data-theme] { --okg-g1-fill:var(--okg-surface); --okg-g2-fill:var(--okg-surface); --okg-d1-fill:var(--okg-surface); --okg-g1-filter:none; --okg-g2-filter:none; --okg-d1-filter:none; }
  .topic-page .contenthero { background:var(--okg-surface); box-shadow:none; border-color:var(--okg-border-strong); }
  .topic-page .contenthero::after { display:none; }
  .okg-glass-ribbon,.okg-footer-ribbon,.okg-pricing-ribbon { display:none; }
}
@media(forced-colors:active) {
  .okg-auth-band { display:none; }
  dialog[data-okg-material="D1"]::backdrop { background:Canvas; backdrop-filter:none; -webkit-backdrop-filter:none; }
  .topic-page .contenthero { background:Canvas; color:CanvasText; border:1px solid CanvasText; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
  .topic-page .contenthero :is(h1,.eyebrow,.contentlead) { color:CanvasText; }
  .topic-page .contenthero::after { display:none; }
  .info,.info-icon,button.info-button { background:Canvas; color:CanvasText; border:1px solid ButtonText; }
  .motion-ui .phone-demo-screen { background:Canvas; color:CanvasText; }
  .phone-demo-controls button { border-color:ButtonText; box-shadow:none; }
  .demo-primary-action, .demo-calendar-events .is-focus { background:Highlight; color:HighlightText; }
  .demo-calendar-events .is-focus :is(strong,small) { color:HighlightText; }
  .demo-calendar-events .is-focus i { background:HighlightText; }
  .brandlogoimg, .brand-lockup img, .auth-brand .logo, .footerbrand img { filter:brightness(0); }
  [data-okg-design], [data-okg-context], [data-workspace-kind][data-theme] { forced-color-adjust:auto; --okg-text:CanvasText; --okg-text-muted:CanvasText; --okg-surface:Canvas; --okg-canvas:Canvas; --okg-accent:LinkText; --okg-accent-soft:Canvas; --okg-on-accent-soft:CanvasText; --okg-focus:Highlight; --okg-g1-fill:Canvas; --okg-g2-fill:Canvas; --okg-d1-fill:Canvas; }
  [data-okg-material], input, select, textarea { background:Canvas; color:CanvasText; border:1px solid ButtonText; box-shadow:none; backdrop-filter:none; }
  .primary,.btn,.homepage-primary { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; }
  :focus-visible { outline:3px solid Highlight; }
  .okg-glass-ribbon,.okg-footer-ribbon,.okg-pricing-ribbon { display:none; }
  * { scrollbar-color:auto; }
}
@media(forced-colors:active) and (prefers-color-scheme:dark) {
  .brandlogoimg, .brand-lockup img, .auth-brand .logo, .footerbrand img { filter:brightness(0) invert(1); }
}
@media print {
  .okg-auth-band { display:none; }
  .brandlogoimg, .brand-lockup img, .auth-brand .logo, .footerbrand img { filter:brightness(0)!important; }
  body[data-okg-design], [data-okg-material] { background:white!important; color:black!important; box-shadow:none!important; backdrop-filter:none!important; }
  .okg-glass-ribbon,.okg-footer-ribbon,.okg-pricing-ribbon,.okg-scroll-progress,.nav,.appbar,.bottomnav { display:none!important; }
  a { color:black; text-decoration:underline; }
}