
:root {
  --persona-transition: 0.3s ease;
  --card-blur: 16px;
  --card-radius: 20px;
  --card-border-opacity: 0.22;
}

[data-persona="dynamic_collaborator"] {
  --persona-primary:   #a209b0;
  --persona-secondary: #d902ee;
  --persona-glow:      rgba(232, 42, 213, 0.4);
  --persona-surface:   rgba(110, 3, 106, 0.062);
  --persona-text:      #f5e4fd;
  --persona-accent:    #e35dfb;
}
[data-persona="independent_pioneer"] {
  --persona-primary:   rgb(242, 143, 4);
  --persona-secondary: #ffaa00;
  --persona-glow:      rgba(184, 151, 42, 0.4);
  --persona-surface:   rgba(184, 144, 42, 0.07);
  --persona-text:      #fff5e0;
  --persona-accent:    #ffaa00;
}
[data-persona="introspective_thinker"] {
  --persona-primary:   #5a6ee8;
  --persona-secondary: #8a9af0;
  --persona-glow:      rgba(90, 110, 232, 0.4);
  --persona-surface:   rgba(90, 110, 232, 0.07);
  --persona-text:      #eef0ff;
  --persona-accent:    #7b8fff;
}
[data-persona="calm_supporter"] {
  --persona-primary:   #0aa6b8;
  --persona-secondary: #00e5ff;
  --persona-glow:      rgba(42, 184, 200, 0.4);
  --persona-surface:   rgba(42, 184, 200, 0.07);
  --persona-text:      #eefcff;
  --persona-accent:    #4de0ee;
}

[data-processing="analytical"] { --modifier-border-style: solid; }
[data-processing="intuitive"]   { --modifier-border-style: dashed; }
[data-processing="balanced"]    { --modifier-border-style: solid; }

[data-energy="seeking"] {
  --energy-saturation: 1.15;
  --energy-glow-scale: 1.5;
  --energy-pulse: persona-pulse 3s ease-in-out infinite;
}
[data-energy="preserving"] {
  --energy-saturation: 0.85;
  --energy-glow-scale: 0.7;
  --energy-pulse: none;
}
[data-energy="balanced"] {
  --energy-saturation: 1;
  --energy-glow-scale: 1;
  --energy-pulse: none;
}

[data-provisional="true"] {
  --persona-primary: color-mix(in srgb, var(--persona-primary) 65%, #888);
  --persona-glow:    rgba(128,128,128,0.2);
  --provisional-badge: block;
}
[data-provisional="false"] { --provisional-badge: none; }

@keyframes persona-pulse {
  0%, 100% { box-shadow: 0 8px 40px var(--persona-glow); }
  50%       { box-shadow: 0 8px calc(60px * var(--energy-glow-scale)) var(--persona-glow); }
}

@keyframes persona-enter {
  from { opacity: 0; transform: translateY(20px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes bar-fill {
  from { width: 0 !important; }
}

