/* The effect is behind content and never intercepts controls. */
.state-effect{position:relative;isolation:isolate;background-color:var(--state-field,#edf2e8)}
.state-effect:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(ellipse at 45% 40%,var(--state-accent,#526d57),transparent 75%);opacity:.16;pointer-events:none}
.state-effect-canvas{display:block;position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.3;border-radius:inherit}
.state-effect[data-shader-renderer=static] .state-effect-canvas{visibility:hidden}
.voice-orb.state-effect{overflow:hidden;background:var(--state-field);color:var(--state-accent)}
.voice-orb.state-effect .state-effect-canvas{z-index:0;opacity:.8}
.workspace-transition{animation:workspace-arrive .24s ease-out both}
@keyframes workspace-arrive{from{opacity:.7;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.workspace-transition{animation:none}.state-effect-canvas{visibility:hidden}}

.page-heading.state-effect{border-radius:16px;padding:12px 16px;margin-left:-16px;margin-right:-16px}
.town-context.state-effect{border-radius:12px;padding:6px 12px}
.opportunity-hot{box-shadow:0 0 0 1px #b2904f66,0 0 18px #b2904f20}
.opportunity-won{border-color:#859b4570;background:linear-gradient(110deg,#e9eed8,var(--panel,#fff))}