/* ============================================================
   FORGE — forge_app_global.css
   Base reset, CSS variables, fonts, shared utilities
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=DM+Sans:wght@400;500;600&display=swap');

:root {
  /* ── Guilded-accurate background scale ── */
  --bg-rail:       #1a1b1e;   /* far-left rail */
  --bg-sidebar:    #26282d;   /* channel sidebar */
  --bg-main:       #2f3136;   /* main chat area */
  --bg-members:    #26282d;   /* members panel */
  --bg-hover:      #3a3d44;   /* hover state */
  --bg-active:     #3d4147;   /* active/selected row */
  --bg-input:      #1e2024;   /* input fields */
  --bg-card:       #32353b;   /* cards, context menus */
  --bg-tooltip:    #1a1b1e;
  --bg-deepest:    #0f1012;   /* page backdrops */
  --bg-deep:       #1a1b1e;   /* inset wells */
  --bg-base:       #1e2024;
  --bg-panel:      #26282d;   /* modals, settings panels */
  --bg-raised:     #32353b;
  --bg-card-hover: #3a3d44;
  --bg-sidebar-footer: #1e2024;   /* user bar */

  --bg-well: #141619;
  --bg-well-2: #16171a;
  --bg-well-3: #1c1e22;
  --bg-modal: #2a2d32;
  --bg-modal-hover: #3a3d42;
  --accent-rgb: 245,196,0;
  --gold-rgb: 240,165,0;

  /* ── Yellow / gold (Guilded brand) ── */
  --yellow:        #f5c400;
  --yellow-dim:    rgba(var(--accent-rgb),0.15);
  --yellow-border: rgba(var(--accent-rgb),0.6);
  --gold:          #f0a500;
  --gold-dim:      #c98a00;
  --gold-border:   rgba(var(--gold-rgb),0.45);
  --gold-glow:     rgba(var(--gold-rgb),0.12);
  --accent:        #f5c400;
  --accent3:       #f0a500;

  /* ── Semantic ── */
  --red:           #e05252;
  --red-dim:       rgba(224,82,82,0.15);
  --green:         #3ba55d;
  --green-dim:     rgba(59,165,93,0.2);
  --blue:          #5b8dee;
  --blue-dim:      rgba(91,141,238,0.15);

  /* ── Text ── */
  --text-primary:   #ffffff;
  --text-secondary: #b9bbbe;
  --text-muted:     #72767d;
  --text-locked:    #4f545c;

  /* ── Borders ── */
  --border:         rgba(255,255,255,0.06);
  --border-strong:  rgba(255,255,255,0.12);
  --border-subtle:  rgba(255,255,255,0.04);

  /* ── Layout ── */
  --rail-width:     56px;
  --sidebar-width:  240px;
  --members-width:  232px;
  --topbar-height:  48px;

  /* ── Radii ── */
  --radius-xs:  3px;
  --radius-sm:  6px;
  --radius-md:  8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* ── The Guilded active frame radius ── */
  --radius-frame: 12px;

  /* ── Fonts ── */
  --font-display: 'Syne',    sans-serif;
  --font-body:    'DM Sans', sans-serif;
  --font-mono:    'Fira Code', monospace;

  --shadow-md:  0 4px 16px rgba(0,0,0,0.4);
  --shadow-lg:  0 8px 32px rgba(0,0,0,0.55);

  --transition-fast: 0.1s ease;
  --transition-base: 0.18s ease;
}
/* ── Color themes ── */
[data-theme="forge"] {
  --bg-rail: #1a1b1e;
  --bg-sidebar: #26282d;
  --bg-main: #2f3136;
  --bg-members: #26282d;
  --bg-hover: #3a3d44;
  --bg-active: #3d4147;
  --bg-input: #1e2024;
  --bg-card: #32353b;
  --bg-tooltip: #1a1b1e;
  --bg-deepest: #0f1012;
  --bg-deep: #1a1b1e;
  --bg-base: #1e2024;
  --bg-panel: #26282d;
  --bg-raised: #32353b;
  --bg-card-hover: #3a3d44;
  --bg-sidebar-footer: #1e2024;
  --bg-well: #141619;
  --bg-well-2: #16171a;
  --bg-well-3: #1c1e22;
  --bg-modal: #2a2d32;
  --bg-modal-hover: #3a3d42;
  --yellow: #f5c400;
  --accent: #f5c400;
  --accent-rgb: 245,196,0;
  --gold: #f0a500;
  --accent3: #f0a500;
  --gold-rgb: 240,165,0;
}
[data-theme="midnight"] {
  --bg-rail: #141924;
  --bg-sidebar: #1e2535;
  --bg-main: #242d41;
  --bg-members: #1e2535;
  --bg-hover: #2d3851;
  --bg-active: #303b54;
  --bg-input: #181d2a;
  --bg-card: #273046;
  --bg-tooltip: #141924;
  --bg-deepest: #0c0f15;
  --bg-deep: #141924;
  --bg-base: #181d2a;
  --bg-panel: #1e2535;
  --bg-raised: #273046;
  --bg-card-hover: #2d3851;
  --bg-sidebar-footer: #181d2a;
  --bg-well: #10141d;
  --bg-well-2: #11151f;
  --bg-well-3: #161c28;
  --bg-modal: #21293b;
  --bg-modal-hover: #2d374f;
  --yellow: #5b9dff;
  --accent: #5b9dff;
  --accent-rgb: 91,157,255;
  --gold: #3f83e6;
  --accent3: #3f83e6;
  --gold-rgb: 63,131,230;
}
[data-theme="lagoon"] {
  --bg-rail: #152123;
  --bg-sidebar: #203133;
  --bg-main: #263b3f;
  --bg-members: #203133;
  --bg-hover: #304a4e;
  --bg-active: #324e52;
  --bg-input: #192729;
  --bg-card: #294044;
  --bg-tooltip: #152123;
  --bg-deepest: #0d1314;
  --bg-deep: #152123;
  --bg-base: #192729;
  --bg-panel: #203133;
  --bg-raised: #294044;
  --bg-card-hover: #304a4e;
  --bg-sidebar-footer: #192729;
  --bg-well: #111a1c;
  --bg-well-2: #121c1e;
  --bg-well-3: #182426;
  --bg-modal: #233639;
  --bg-modal-hover: #2f494d;
  --yellow: #2dd4d9;
  --accent: #2dd4d9;
  --accent-rgb: 45,212,217;
  --gold: #1fb0b5;
  --accent3: #1fb0b5;
  --gold-rgb: 31,176,181;
}
[data-theme="evergreen"] {
  --bg-rail: #16221c;
  --bg-sidebar: #21322a;
  --bg-main: #283d33;
  --bg-members: #21322a;
  --bg-hover: #324c3f;
  --bg-active: #354f42;
  --bg-input: #1a2821;
  --bg-card: #2c4137;
  --bg-tooltip: #16221c;
  --bg-deepest: #0d1410;
  --bg-deep: #16221c;
  --bg-base: #1a2821;
  --bg-panel: #21322a;
  --bg-raised: #2c4137;
  --bg-card-hover: #324c3f;
  --bg-sidebar-footer: #1a2821;
  --bg-well: #121b16;
  --bg-well-2: #131d18;
  --bg-well-3: #19251f;
  --bg-modal: #25372e;
  --bg-modal-hover: #324a3e;
  --yellow: #3ddc84;
  --accent: #3ddc84;
  --accent-rgb: 61,220,132;
  --gold: #2bb56a;
  --accent3: #2bb56a;
  --gold-rgb: 43,181,106;
}
[data-theme="ember"] {
  --bg-rail: #221716;
  --bg-sidebar: #332320;
  --bg-main: #3e2a27;
  --bg-members: #332320;
  --bg-hover: #4d3531;
  --bg-active: #513733;
  --bg-input: #281c1a;
  --bg-card: #422e2b;
  --bg-tooltip: #221716;
  --bg-deepest: #140e0d;
  --bg-deep: #221716;
  --bg-base: #281c1a;
  --bg-panel: #332320;
  --bg-raised: #422e2b;
  --bg-card-hover: #4d3531;
  --bg-sidebar-footer: #281c1a;
  --bg-well: #1b1312;
  --bg-well-2: #1d1413;
  --bg-well-3: #261a18;
  --bg-modal: #382724;
  --bg-modal-hover: #4c3430;
  --yellow: #ff6b4a;
  --accent: #ff6b4a;
  --accent-rgb: 255,107,74;
  --gold: #e0512f;
  --accent3: #e0512f;
  --gold-rgb: 224,81,47;
}
[data-theme="rosewood"] {
  --bg-rail: #22161b;
  --bg-sidebar: #322128;
  --bg-main: #3d2831;
  --bg-members: #322128;
  --bg-hover: #4c323d;
  --bg-active: #4f3540;
  --bg-input: #281a20;
  --bg-card: #412c35;
  --bg-tooltip: #22161b;
  --bg-deepest: #140d10;
  --bg-deep: #22161b;
  --bg-base: #281a20;
  --bg-panel: #322128;
  --bg-raised: #412c35;
  --bg-card-hover: #4c323d;
  --bg-sidebar-footer: #281a20;
  --bg-well: #1b1216;
  --bg-well-2: #1d1317;
  --bg-well-3: #25191e;
  --bg-modal: #37252c;
  --bg-modal-hover: #4a323c;
  --yellow: #ff6fa5;
  --accent: #ff6fa5;
  --accent-rgb: 255,111,165;
  --gold: #e4548b;
  --accent3: #e4548b;
  --gold-rgb: 228,84,139;
}
[data-theme="amethyst"] {
  --bg-rail: #1c1523;
  --bg-sidebar: #292033;
  --bg-main: #32263f;
  --bg-members: #292033;
  --bg-hover: #3e304e;
  --bg-active: #413252;
  --bg-input: #201929;
  --bg-card: #362944;
  --bg-tooltip: #1c1523;
  --bg-deepest: #100d14;
  --bg-deep: #1c1523;
  --bg-base: #201929;
  --bg-panel: #292033;
  --bg-raised: #362944;
  --bg-card-hover: #3e304e;
  --bg-sidebar-footer: #201929;
  --bg-well: #16111c;
  --bg-well-2: #18121e;
  --bg-well-3: #1f1826;
  --bg-modal: #2d2339;
  --bg-modal-hover: #3d2f4d;
  --yellow: #b388ff;
  --accent: #b388ff;
  --accent-rgb: 179,136,255;
  --gold: #9a6bf0;
  --accent3: #9a6bf0;
  --gold-rgb: 154,107,240;
}
[data-theme="graphite"] {
  --bg-rail: #1c1c1c;
  --bg-sidebar: #2a2a2a;
  --bg-main: #333333;
  --bg-members: #2a2a2a;
  --bg-hover: #3f3f3f;
  --bg-active: #424242;
  --bg-input: #212121;
  --bg-card: #373737;
  --bg-tooltip: #1c1c1c;
  --bg-deepest: #101010;
  --bg-deep: #1c1c1c;
  --bg-base: #212121;
  --bg-panel: #2a2a2a;
  --bg-raised: #373737;
  --bg-card-hover: #3f3f3f;
  --bg-sidebar-footer: #212121;
  --bg-well: #161616;
  --bg-well-2: #181818;
  --bg-well-3: #1f1f1f;
  --bg-modal: #2e2e2e;
  --bg-modal-hover: #3e3e3e;
  --yellow: #d7dbe0;
  --accent: #d7dbe0;
  --accent-rgb: 215,219,224;
  --gold: #aeb4bc;
  --accent3: #aeb4bc;
  --gold-rgb: 174,180,188;
}



/* These three come with a tag */
[data-theme="founder"] {
  --bg-rail: #000000;
  --bg-sidebar: #0a0a0a;
  --bg-main: #101010;
  --bg-members: #0a0a0a;
  --bg-hover: #1f1c14;
  --bg-active: #2a2519;
  --bg-input: #050505;
  --bg-card: #161513;
  --bg-tooltip: #000000;
  --bg-deepest: #000000;
  --bg-deep: #000000;
  --bg-base: #050505;
  --bg-panel: #0c0c0c;
  --bg-raised: #161513;
  --bg-card-hover: #1f1c14;
  --bg-sidebar-footer: #050505;
  --bg-well: #050505;
  --bg-well-2: #070707;
  --bg-well-3: #0d0d0d;
  --bg-modal: #121212;
  --bg-modal-hover: #201d15;
  --yellow: #e8c14a;
  --accent: #e8c14a;
  --accent-rgb: 232,193,74;
  --gold: #c9a227;
  --accent3: #c9a227;
  --gold-rgb: 201,162,39;
  --text-primary: #ffffff;
  --text-secondary: #e4e1d8;
  --text-muted: #94907f;
  --border: rgba(232,193,74,0.16);
  --border-strong: rgba(232,193,74,0.34);
  --border-subtle: rgba(232,193,74,0.08);
}

[data-theme="founder"] .btn-yellow {
  background: linear-gradient(135deg, #f7e08a, #d4a017 55%, #b8860b);
  color: #0b0b0b;
}

[data-theme="alpha"] {
  --bg-rail: #101312;
  --bg-sidebar: #191d1b;
  --bg-main: #202522;
  --bg-members: #191d1b;
  --bg-hover: #2c332e;
  --bg-active: #333b35;
  --bg-input: #141816;
  --bg-card: #252b27;
  --bg-tooltip: #101312;
  --bg-deepest: #0a0c0b;
  --bg-deep: #101312;
  --bg-base: #141816;
  --bg-panel: #191d1b;
  --bg-raised: #252b27;
  --bg-card-hover: #2c332e;
  --bg-sidebar-footer: #141816;
  --bg-well: #0e110f;
  --bg-well-2: #101311;
  --bg-well-3: #161a17;
  --bg-modal: #1e2320;
  --bg-modal-hover: #2b322d;
  --yellow: #b6f24a;
  --accent: #b6f24a;
  --accent-rgb: 182,242,74;
  --gold: #8fc92f;
  --accent3: #8fc92f;
  --gold-rgb: 143,201,47;
}

[data-theme="beta"] {
  --bg-rail: #0a1720;
  --bg-sidebar: #10222e;
  --bg-main: #152b39;
  --bg-members: #10222e;
  --bg-hover: #1e3a4b;
  --bg-active: #234253;
  --bg-input: #0d1c27;
  --bg-card: #193240;
  --bg-tooltip: #0a1720;
  --bg-deepest: #061018;
  --bg-deep: #0a1720;
  --bg-base: #0d1c27;
  --bg-panel: #10222e;
  --bg-raised: #193240;
  --bg-card-hover: #1e3a4b;
  --bg-sidebar-footer: #0d1c27;
  --bg-well: #091620;
  --bg-well-2: #0b1924;
  --bg-well-3: #0f202c;
  --bg-modal: #142935;
  --bg-modal-hover: #1e3a4a;
  --yellow: #5ccdf6;
  --accent: #5ccdf6;
  --accent-rgb: 92,205,246;
  --gold: #3aa9d4;
  --accent3: #3aa9d4;
  --gold-rgb: 58,169,212;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; }
body {
  font-family: var(--font-body);
  background: var(--bg-main);
  color: var(--text-primary);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}
a            { color: inherit; text-decoration: none; }
button       { cursor: pointer; font-family: var(--font-body); }
input, textarea, select { font-family: var(--font-body); }
ul, ol { list-style: none; }

/* ── Scrollbar ── */
::-webkit-scrollbar       { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 2px; }
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.1) transparent; }

/* ── Utilities ── */
.hidden { display: none !important; }

/* Streamer Mode */
.sm-note { display: none; color: var(--text-muted); font-size: 13px; }
[data-streamer="on"] .sm-hide { display: none !important; }
[data-streamer="on"] .sm-note { display: revert; }
.sm-list { margin: 0; padding-left: 18px; list-style: disc; color: var(--text-secondary); font-size: 13px; line-height: 1.9; }

/* ══════════════════════════════════════
   THE GUILDED YELLOW FRAME
   Used on: DM btn, server icons (active),
   server browser btn, user profile block,
   @ btn, settings btn, ... btn
══════════════════════════════════════ */
.g-frame {
  position: relative;
  border-radius: var(--radius-frame);
  border: 2.5px solid var(--yellow);
  background: var(--bg-rail);
}

/* ── Shared Buttons ── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: all var(--transition-base);
  white-space: nowrap;
  line-height: 1;
}
.btn:active { transform: scale(0.97); }

.btn-yellow {
  background: var(--yellow);
  color: #1a1b1e;
  font-weight: 700;
}
.btn-yellow:hover { filter: brightness(1.1); }

.btn-ghost {
  background: transparent;
  color: var(--text-secondary);
  border: 1px solid var(--border-strong);
}
.btn-ghost:hover { background: var(--bg-hover); color: var(--text-primary); }

.btn-danger {
  background: var(--red-dim);
  color: var(--red);
  border: 1px solid rgba(224,82,82,0.25);
}
.btn-danger:hover { background: rgba(224,82,82,0.25); }

.btn-sm  { padding: 5px 12px; font-size: 13px; }
.btn-lg  { padding: 12px 28px; font-size: 15px; border-radius: var(--radius-md); }
.btn-full { width: 100%; }

/* ── Form elements ── */
.form-group { margin-bottom: 16px; }

.form-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.7px;
  margin-bottom: 6px;
}

.form-input {
  width: 100%;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: 14px;
  color: var(--text-primary);
  outline: none;
  transition: border-color var(--transition-base);
}
.form-input:focus { border-color: var(--yellow); box-shadow: 0 0 0 3px var(--yellow-dim); }
.form-input::placeholder { color: var(--text-muted); }

.form-hint { font-size: 12px; color: var(--text-muted); margin-top: 4px; }

.form-error-msg {
  display: none;
  background: rgba(224,82,82,0.10);
  border: 1px solid rgba(224,82,82,0.25);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: 13px;
  color: #f08080;
  margin-bottom: 14px;
}
.form-error-msg.show { display: block; }

.form-checkbox-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 18px;
}
.form-checkbox-row input[type="checkbox"] {
  width: 16px; height: 16px;
  accent-color: var(--yellow);
  margin-top: 2px;
  flex-shrink: 0;
  cursor: pointer;
}
.form-checkbox-row label { font-size: 13px; color: var(--text-secondary); cursor: pointer; line-height: 1.5; }
.form-checkbox-row a { color: var(--yellow); }

.input-password-wrap { position: relative; }
.input-password-wrap .form-input { padding-right: 42px; }
.password-toggle {
  position: absolute;
  right: 12px; top: 50%;
  transform: translateY(-50%);
  background: none; border: none;
  color: var(--text-muted);
  cursor: pointer; font-size: 15px; padding: 0;
  transition: color var(--transition-fast);
}
.password-toggle:hover { color: var(--text-secondary); }

/* ── Status dots ── */
.status-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  border: 2px solid var(--bg-sidebar);
  flex-shrink: 0;
  display: inline-block;
}
.status-online  { background: var(--green); }
.status-idle    { background: #faa61a; }
.status-dnd     { background: var(--red); }
.status-offline { background: var(--text-muted); }

/* ── Badges ── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.3px;
}
.badge-bot    { background: var(--blue-dim);  color: var(--blue); border: 1px solid rgba(91,141,238,0.3); }
.badge-yellow { background: var(--yellow-dim); color: var(--yellow); }
.badge-beta   { background: rgba(255,255,255,0.08); color: var(--text-secondary); border: 1px solid var(--border-strong); }

/* User tags */
.user-tag {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 2px 9px;
  border-radius: 999px;
  border: 1px solid var(--border-strong);
  background: var(--bg-active);
  color: var(--text-secondary);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  overflow: hidden;
  vertical-align: middle;
}
.user-tag svg { width: 12px; height: 12px; flex-shrink: 0; }
.user-tag-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* These keep their colors on every theme */
.user-tag-founder,
.user-tag-alpha,
.user-tag-beta,
.user-tag-developer,
.user-tag-staff {
  border-color: transparent;
  background: var(--tag-fill) padding-box, var(--tag-edge) border-box;
  box-shadow: 0 0 8px var(--tag-glow);
  color: var(--tag-text);
}
.user-tag-founder svg,
.user-tag-alpha svg,
.user-tag-beta svg,
.user-tag-developer svg,
.user-tag-staff svg { color: var(--tag-icon); }

/* A slow band of light across the badge */
.user-tag-founder::after,
.user-tag-alpha::after,
.user-tag-beta::after,
.user-tag-developer::after,
.user-tag-staff::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  left: -60%;
  width: 40%;
  background: linear-gradient(100deg, transparent, var(--tag-shine), transparent);
  animation: user-tag-shine 5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes user-tag-shine {
  0%, 70% { left: -60%; }
  100%    { left: 120%; }
}

.user-tag-founder {
  --tag-fill: linear-gradient(135deg, #050505, #1d1d1d 55%, #050505);
  --tag-edge: linear-gradient(120deg, #fff3b8, #d4a017 35%, #8a6508 55%, #ffe9a0 80%, #b8860b);
  --tag-glow: rgba(212,160,23,0.3);
  --tag-shine: rgba(255,233,160,0.28);
  --tag-text: #ffffff;
  --tag-icon: #e8c14a;
  letter-spacing: 0.4px;
}
.user-tag-alpha {
  --tag-fill: linear-gradient(135deg, #101312, #202a1b 55%, #101312);
  --tag-edge: linear-gradient(120deg, #e4ff9e, #b6f24a 35%, #5f8f1c 55%, #d0fb7c 80%, #8fc92f);
  --tag-glow: rgba(182,242,74,0.28);
  --tag-shine: rgba(214,255,140,0.28);
  --tag-text: #e4fbb8;
  --tag-icon: #b6f24a;
}
.user-tag-beta {
  --tag-fill: linear-gradient(135deg, #0a1720, #16364a 55%, #0a1720);
  --tag-edge: linear-gradient(120deg, #c8f1ff, #5ccdf6 35%, #2a7ea3 55%, #a4e6fd 80%, #3aa9d4);
  --tag-glow: rgba(92,205,246,0.28);
  --tag-shine: rgba(170,232,255,0.3);
  --tag-text: #d3f3ff;
  --tag-icon: #5ccdf6;
}
.user-tag-developer {
  --tag-fill: linear-gradient(135deg, #0f0b24, #271c56 55%, #0f0b24);
  --tag-edge: linear-gradient(120deg, #cdbcff, #8b6cff 35%, #4b34b0 55%, #6fb6ff 80%, #7a5cf0);
  --tag-glow: rgba(139,108,255,0.3);
  --tag-shine: rgba(190,175,255,0.3);
  --tag-text: #e4dcff;
  --tag-icon: #a78fff;
  font-family: var(--font-mono), monospace;
  letter-spacing: -0.2px;
}
.user-tag-staff {
  --tag-fill: linear-gradient(135deg, #1c060a, #4a0f19 55%, #1c060a);
  --tag-edge: linear-gradient(120deg, #ffc9c9, #ef4655 35%, #8f1622 55%, #ff9a9a 80%, #c9263a);
  --tag-glow: rgba(239,70,85,0.3);
  --tag-shine: rgba(255,190,190,0.28);
  --tag-text: #ffe6e6;
  --tag-icon: #ff6573;
}

/* Colors that keep moving */
.user-tag-creator {
  border-color: rgba(255,255,255,0.35);
  background: linear-gradient(90deg, #ff2d78, #ff7a18, #a53dff, #ff2d78);
  background-size: 300% 100%;
  box-shadow: 0 0 9px rgba(255,45,120,0.4);
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0,0,0,0.45);
  animation: user-tag-flow 6s linear infinite;
}
@keyframes user-tag-flow {
  from { background-position: 0% 0; }
  to   { background-position: 150% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .user-tag-founder::after,
  .user-tag-alpha::after,
  .user-tag-beta::after,
  .user-tag-developer::after,
  .user-tag-staff::after { animation: none; display: none; }
  .user-tag-creator { animation: none; }
}