/*
 ███████╗ ██████╗██╗  ██╗███████╗██╗      ██████╗ ███╗   ██╗
 ██╔════╝██╔════╝██║  ██║██╔════╝██║     ██╔═══██╗████╗  ██║
 █████╗  ██║     ███████║█████╗  ██║     ██║   ██║██╔██╗ ██║
 ██╔══╝  ██║     ██╔══██║██╔══╝  ██║     ██║   ██║██║╚██╗██║
 ███████╗╚██████╗██║  ██║███████╗███████╗╚██████╔╝██║ ╚████║
 ╚══════╝ ╚═════╝╚═╝  ╚═╝╚══════╝╚══════╝ ╚═════╝ ╚═╝  ╚═══╝
*/

:root{
  --void: #0b0a12;
  --panel: #111022;
  --panel2:#161533;
  --border:#26254a;
  --text2: #c4c3e2;
  --purple:#8b5cf6;
  --purple2:#a78bfa;
}

.bg-void {
  background:
    radial-gradient(1200px 600px at 20% 0%, #16113a 0%, var(--void) 55%) fixed;
}

.card-void{
  background: linear-gradient(180deg, var(--panel) 0%, #0f0e1e 100%);
  border: 1px solid var(--border);
}

.border-void { border-color: var(--border) !important; }

.form-control-void{
  background: #0e0d1c;
  border: 1px solid var(--border);
  color: #fff;
  border-radius: 0;
  padding: .85rem .9rem;
}

.form-control-void::placeholder{ color: #9c9ac6; }

.form-control-void:focus{
  background:#0e0d1c;
  color:#fff;
  border-color: var(--purple);
  box-shadow: 0 0 0 .2rem rgba(139,92,246,.18);
}

.btn-purple{
  border-radius: 0;
  background: linear-gradient(180deg, var(--purple) 0%, #6d28d9 100%);
  border: 1px solid rgba(167,139,250,.25);
}

.btn-purple:hover{ filter: brightness(1.06); }

.profile-shell{
  border: 1px solid var(--border);
  background: linear-gradient(180deg, var(--panel2), #0d0c1a);
}

.banner{
  height: 180px;
  background: #1a1733;
  border-bottom: 1px solid var(--border);
  background-size: cover;
  background-position: center;
}

.avatar-wrap{
  width: 78px;
  height: 78px;
  border: 1px solid var(--border);
  background: #0e0d1c;
  border-radius: 0;
  margin-top: -39px;
  flex-shrink: 0;
}

.avatar{
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 0;
  object-fit: cover;
}

.pill{
  border: 1px solid var(--border);
  background: rgba(0,0,0,.28);
  padding: .7rem .8rem;
  border-radius: 0;
}

.pill .k{
  font-size: .78rem;
  color: #b6b4e0;
  text-transform: uppercase;
  letter-spacing: .09em;
}

.pill .v{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
               "Liberation Mono", "Courier New", monospace;
  font-size: .95rem;
  margin-top: .25rem;
  color: #ffffff;
  word-break: break-word;
}

.text-secondary{ color: var(--text2) !important; }

.mini{
  font-size: .82rem;
  color: #bdbbe4;
}

.badge-void{
  border-radius: 0;
  border: 1px solid var(--border);
  background: rgba(139,92,246,.14);
  color: #f1efff;
  padding: .45rem .6rem;
  font-weight: 500;
}

.chip{
  border-radius: 0;
  border: 1px solid rgba(167,139,250,.4);
  background: rgba(167,139,250,.14);
  color: #f4f1ff;
  padding: .25rem .5rem;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.swatch{
  width: 18px;
  height: 18px;
  border: 1px solid rgba(255,255,255,.18);
  display: inline-block;
  border-radius: 0;
  background: transparent;
}

.btn-sq{
  border-radius: 0;
  padding: .25rem .55rem;
}

.recent-label{
  letter-spacing: .08em;
}

.recent-chip{
  border-radius: 0;
  border: 1px solid rgba(167,139,250,.35);
  background: rgba(0,0,0,.22);
  color: #efeaff;
  padding: .4rem .55rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
               "Liberation Mono", "Courier New", monospace;
  font-size: .9rem;
  cursor: pointer;
  user-select: none;
  transition: filter .12s ease;
}

.recent-chip:hover{ filter: brightness(1.08); }
.recent-chip:active{ filter: brightness(0.98); }

.tabbtn{
  border-color: rgba(167,139,250,.35) !important;
  background: rgba(0,0,0,.18);
}

.tabbtn.is-active{
  background: rgba(139,92,246,.18);
  border-color: rgba(167,139,250,.55) !important;
}

.media-row{
  border: 1px solid rgba(167,139,250,.25);
  background: rgba(0,0,0,.18);
  padding: .55rem .65rem;
  border-radius: 0;
}

.media-row a{
  color: #efeaff;
  text-decoration: none;
}

.media-row a:hover{
  text-decoration: underline;
}


#name {
  color: #a78bfa;
}