.gc-painad{
  max-width: 860px;
  margin: 20px auto;
}

.gc-painad-header{
  align-items: flex-start;
}

.gc-painad-title h2{
  margin: 0 0 6px;
}

.gc-painad-title .gc-muted{
  margin: 0;
}

.gc-painad-hint{
  margin: 12px 0 18px;
}

.gc-painad-form{
  display: grid;
  gap: 12px;
}

.gc-painad-q-title{
  margin: 0 0 6px;
  font-family: var(--gc-font-title);
  font-weight: 800;
  color: var(--gc-dark);
}

.gc-painad-q-desc{
  margin: 0 0 10px;
  color: var(--gc-muted);
  font-size: 13px;
}

.gc-painad-actions{
  margin-top: 12px;
}

.gc-painad-error{
  display: none;
  margin-top: 12px;
}

.gc-painad-result{
  display: none;
  margin-top: 16px;
}

.gc-painad-res-main{
  font-size: 16px;
  font-weight: 900;
  color: var(--gc-dark);
  margin-bottom: 8px;
  font-family: var(--gc-font-title);
}

.gc-painad-res-detail{
  color: var(--gc-muted);
  margin-bottom: 10px;
}

.gc-painad-tags .gc-chip{
  font-weight: 800;
}

.gc-painad-chip-low{
  background: rgba(47, 191, 113, .12);
  border-color: rgba(47, 191, 113, .35);
  color: #0a3b22;
}

.gc-painad-chip-mid{
  background: rgba(255, 176, 32, .16);
  border-color: rgba(255, 176, 32, .4);
  color: #6b4b00;
}

.gc-painad-chip-high{
  background: rgba(255, 77, 77, .16);
  border-color: rgba(255, 77, 77, .4);
  color: #6b0e0e;
}

.gc-painad-footer,
.gc-painad-ref{
  font-size: 12px;
  text-align: right;
  margin: 8px 0 0;
}

@media (max-width: 560px){
  .gc-painad{
    margin: 12px;
  }
}