/* Explicit surface components only: no dimensions, radii, controls or device bezels. */
:root{
 --surface-outline:rgb(35 35 31 / 9%);
 --surface-shadow:0 2px 8px rgb(35 35 31 / 4%);
 --surface-overlay-shadow:0 6px 20px rgb(35 35 31 / 7%);
}
/* Preserve existing border widths, pastel backgrounds and decorative open canvases. */
:root body :is(
 .reference-media,.faithful-mini-chat,.story-ai-prompt,.story-real-editor,.story-chat-card,
 .cm-tile,.guard-card,.guard-sheet,.closing-install,
 .auto-language-demo,.auto-grid article,.auto-scenario,.auto-example-steps li,
 .auto-feature-stack article,
 .contact-card,.ct-tool-grid article,.ct-context-cards article,.ct-media-card,.ct-demo,.sd-tool-mini,
 .protection-result,.fs-visual-email,.fs-visual-ai,.ec-gallery,.ec-email,.ec-results-grid article,
 .fs-callout,.fs-card,.fs-widget-examples article,.fs-review-journey article,.fs-directory-grid article,
 .fh-tool-group,.fh-chat-preview,.fh-ai-execution,
 .lang-hub,.lang-greeting,.lang-count,.lang-word-stack,.lang-popup-stage,.lang-popup-example,
 .mcp-preview,.mcp-example,.mcp-capabilities article,.mcp-prompt,
 .migration-composer,.migration-flow-node,.migration-service,.migration-launch-review,
 .migration-crescent-mobile li,.move-cards article,.merchant-quote,
 .plan-card,.rv-all,.rv-review-card,.rv-floating-focus,.rv-request-visual,
 .rv-flow > div:not(.rv-flow-branches),.rv-flow-branches div > div,
 .sd-prompt,.sd-preview,.showcase-check-row,.language-campaign-preview,.showcase-prompt,
 .showcase-store,.showcase-popup,.showcase-review-product,.showcase-review,.showcase-segment,.showcase-team,
 .plus-check-display,.suite-platform,.suite-mail,.suite-message,.suite-browser,.suite-popup,.suite-stock,.suite-review,
 .automation-request,.automation-workspace,.plus-closing-panel,
 .sf-popup,.sf-scenarios article,.sf-campaign-grid article,.sf-brief,.sf-design-details,
 .sf-language-popup,.sf-language-email,.sf-flow-node,.sf-flow-branches > div > div,
 .sms-capability-card,.sc-message,
 .wg-mini,.wg-review-sample,.wa-panel,.wg-format,.rw-product,.rw-all,.rw-tile,
 .wg-stock-demo,.wg-store-demo,.wg-notify-form,.wg-brand-demo,
 .home-popup-preview,.hw-chat,.hw-stock-form,.hw-subscribe,
 .help-task-card:not(:hover):not(:focus-visible)
):not(button,input,select,textarea,[role="button"],[aria-selected="true"],.is-selected){
 border-color:var(--surface-outline)!important;
 box-shadow:var(--surface-shadow)!important;
}
/* Keep small request cards light, including dark examples with no visible border. */
:root body .story-prompt{
 box-shadow:var(--surface-shadow);
}
:root body .story-visual-panel[data-story-panel="1"] > .story-prompt,
:root body [data-story-step="1"] .story-mobile-visual > .story-prompt{
 border-color:var(--surface-outline);box-shadow:var(--surface-shadow);
}
/* Floating navigation panels retain enough separation from the page beneath them. */
:root body .site-header .nav-dropdown-panel,
:root body .website-language-panel,
:root body .help-nav-panel{
 border-color:var(--surface-outline);box-shadow:var(--surface-overlay-shadow);
}
/* Help Center uses its own container names. */
:root body:has(.help-brand) :is(.support,.help-navigation){border-color:var(--surface-outline);box-shadow:var(--surface-shadow)}