fix(web): flatten nested cards and remove decorative product surfaces

[jeanduplessis]

Problem

Feature screens use cards inside cards, gradients, glassmorphism, default shadows, oversized radii, and decorative glows instead of surface hierarchy, spacing, and dividers.

Remediation action

Flatten audited product composition onto canonical cards, inset regions, dividers, and surface roles.

Representative scope

• apps/web/src/components/KiloCardLayout.tsx:37
• apps/web/src/components/auth/AuthMarketingAside.tsx:53
• apps/web/src/components/profile/ConnectedAccountsCard.tsx:75
• apps/web/src/app/get-started/slack/_components/SlackConnectStep.tsx:57
• apps/web/src/components/referrals/KiloPassReferralPageContent.tsx:252
• apps/web/src/components/security-agent/SecurityConfigSections.tsx:220
• apps/web/src/app/(app)/claw/components/billing/WelcomePage.tsx:696
• apps/web/src/components/gastown/GastownBackdrop.tsx:14
• apps/web/src/app/(app)/wasteland/WastelandListPageClient.tsx:62
• apps/web/src/app/(app)/learn/page.tsx:66

Acceptance criteria

• One card boundary represents each distinct content/interaction region.
• Internal grouping uses headings, gaps, separators, definition lists, or surface.inset, not nested cards.
• Product surfaces remove gradients, glass blur, decorative glow, and baseline shadow depth.
• Cards/dialogs/containers use only canonical radii and spacing.
• Brand yellow remains scarce and is not used for decorative borders or body emphasis.