:root {
    --parent: #9b72b0;
    --parentLight: #ebe3ef;
}

header { border-top: 0.625em solid var(--parent); }

nav, .navigation { background: var(--parent); }
h1 { background: var(--parentLight); color: var(--parent); border-top: 3px solid var(--parent); }
h2 { color: var(--parent); }

.content nav a.is-active, .dialog button, .dialog a { background: var(--parent); }
.content div.information-panel, nav.mobile a.is-active { background: var(--parentLight); }

.featured { border-top: 3px solid var(--parent); }
footer { border-top: 1.85em solid var(--parentLight); }
legend { border-bottom: 1ox solid var(--parent); color: var(--parent); }
input, textarea { border: 1px solid var(--parent); }
input[type="checkbox"] { border: 1px solid var(--parent); }
input[type="checkbox"]::before, input[type="radio"]::before { box-shadow: inset 1.6em 1.6em var(--parent); }
input[type="checkbox"]:checked, input[type="radio"]:checked, input[type="checkbox"]:checked, input[type="radio"]:focus  { border: 1px solid var(--parent); }
input[type="submit"] { background: var(--parent); }
input[type="submit"]:hover { background: var(--parentLight); }