duolingo dark test by astaliya

/* ==UserStyle==
@name           14/12/2022, 22:00:37
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */
@-moz-document domain("duolingo.com/learn") {
    /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
    html {
        -webkit-text-size-adjust: 100%;
        line-height: 1.15
    }

    body {
        margin: 0
    }

    main {
        display: block
    }

    h1 {
        font-size: 2em;
        margin: .67em 0
    }

    hr {
        box-sizing: content-box;
        overflow: visible
    }

    pre {
        font-family: monospace, monospace;
        font-size: 1em
    }

    a {
        background-color: transparent
    }

    abbr[title] {
        border-bottom: none;
        text-decoration: underline;
        text-decoration: underline dotted
    }

    b,
    strong {
        font-weight: bolder
    }

    code,
    kbd,
    samp {
        font-family: monospace, monospace;
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        font-size: 75%;
        line-height: 0;
        position: relative;
        vertical-align: baseline
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    img {
        border-style: none
    }

    button,
    input,
    optgroup,
    select,
    textarea {
        font-family: inherit;
        font-size: 100%;
        line-height: 1.15;
        margin: 0
    }

    button,
    input {
        overflow: visible
    }

    button,
    select {
        text-transform: none
    }

    [type=button],
    [type=reset],
    [type=submit],
    button {
        -webkit-appearance: button
    }

    [type=button]::-moz-focus-inner,
    [type=reset]::-moz-focus-inner,
    [type=submit]::-moz-focus-inner,
    button::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=button]:-moz-focusring,
    [type=reset]:-moz-focusring,
    [type=submit]:-moz-focusring,
    button:-moz-focusring {
        outline: 1px dotted ButtonText
    }

    fieldset {
        padding: .35em .75em .625em
    }

    legend {
        box-sizing: border-box;
        color: inherit;
        display: table;
        max-width: 100%;
        padding: 0;
        white-space: normal
    }

    progress {
        vertical-align: baseline
    }

    textarea {
        overflow: auto
    }

    [type=checkbox],
    [type=radio] {
        box-sizing: border-box;
        padding: 0
    }

    [type=number]::-webkit-inner-spin-button,
    [type=number]::-webkit-outer-spin-button {
        height: auto
    }

    [type=search] {
        -webkit-appearance: textfield;
        outline-offset: -2px
    }

    [type=search]::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-file-upload-button {
        -webkit-appearance: button;
        font: inherit
    }

    details {
        display: block
    }

    summary {
        display: list-item
    }

    [hidden],
    template {
        display: none
    }

    :root {
        --web-ui_button-border-radius: 16px
    }

    *,
    :after,
    :before,
    button,
    button:focus,
    input,
    textarea {
        -webkit-tap-highlight-color: transparent;
        box-sizing: inherit;
        font-family: din-round, sans-serif;
        outline: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none
    }

    @media (min-width: 700px) {
        *,
        :after,
        :before,
        button,
        button:focus,
        input,
        textarea {
            -webkit-user-select: auto;
            -moz-user-select: auto;
            user-select: auto
        }
    }

    input,
    textarea {
        -webkit-user-select: auto;
        -moz-user-select: auto;
        user-select: auto
    }

    [dir=ltr] {
        text-align: initial
    }

    [dir=rtl] {
        font-kerning: none
    }

    ::-moz-placeholder {
        color: #afafaf;
        font-weight: 500;
        opacity: 1
    }

    ::placeholder {
        color: #afafaf;
        font-weight: 500;
        opacity: 1
    }

    html {
        overflow-scrolling: touch;
        box-sizing: border-box;
        overflow-y: scroll;
        touch-action: manipulation
    }

    @media (min-width: 700px) {
        html {
            overflow-scrolling: auto
        }
    }

    body {
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        background: #000000d6;
        color: #3c3c3c;
        font: 500 17px/20px sans-serif
    }

    @media (min-width: 700px) {
        body {
            padding-bottom: var(--onetrust-banner-height, 0)
        }
    }

    strong {
        font-weight: 700
    }

    a {
        text-decoration: none
    }

    label {
        cursor: pointer
    }

    h1 {
        font-size: 32px;
        line-height: 40px;
        margin: 0 0 50px
    }

    h1,
    h2 {
        font-weight: 700
    }

    h2 {
        color: #3c3c3c;
        font-size: 24px;
        line-height: 26px;
        margin: 0 0 25px
    }

    h3 {
        font-size: 19px;
        font-weight: 700
    }

    h3,
    h4 {
        margin: 0 0 10px
    }

    h4 {
        color: #3c3c3c;
        font-size: 18px
    }

    h5 {
        font-size: 15px;
        margin: 0 0 10px
    }

    h5,
    h6 {
        font-weight: 700
    }

    h6 {
        color: #999;
        font-size: 13px;
        margin: 0;
        text-transform: uppercase
    }

    hr {
        border: 0;
        border-top: 2px solid #e5e5e5;
        height: 0;
        margin: 40px 0
    }

    p {
        margin: 0 0 18px
    }

    table {
        border-spacing: 0
    }

    td,
    th {
        line-height: 22px;
        padding: 12px 16px;
        text-align: left
    }

    ol,
    ul {
        list-style: none;
        margin: 0;
        padding: 0
    }

    button {
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none
    }

    input[type=checkbox] {
        -webkit-appearance: none;
        background: #fff;
        border: 2px solid #e5e5e5;
        border-radius: 5px;
        cursor: pointer;
        height: 20px;
        margin: 0;
        position: relative;
        width: 20px
    }

    input[type=checkbox]:checked {
        border-color: #1caff6
    }

    input[type=checkbox]:checked:after {
        border-bottom: 3px solid #1caff6;
        border-left: 3px solid #1caff6;
        content: "";
        height: 35%;
        left: 25%;
        position: absolute;
        top: 31%;
        transform: rotate(-45deg);
        width: 55%
    }

    input[type=radio] {
        cursor: pointer;
        opacity: 0
    }

    input[type=email],
    input[type=password],
    input[type=radio],
    input[type=search],
    input[type=tel],
    input[type=text],
    input[type=url] {
        -webkit-appearance: none
    }

    input {
        box-shadow: none
    }

    ._33LFc {
        border-radius: 50%
    }

    ._17g0s {
        border: 0
    }

    .hjw0S {
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        align-items: center;
        border-radius: 50%;
        box-sizing: border-box;
        color: #fff;
        display: inline-flex;
        font: 700 17px/25px din-round, sans-serif;
        justify-content: center;
        vertical-align: middle
    }

    ._2gdgw {
        background-color: #ce82ff
    }

    .Yyjgf {
        background-color: #ff4b4b
    }

    ._2fMzM {
        background-color: #ff9600
    }

    ._1-Cq6 {
        background-color: #1cb0f6
    }

    ._2MeJN {
        background-color: #58a700
    }

    ._26a7Y {
        border-style: dashed;
        border-width: 2px;
        color: #afafaf
    }

    ._7hJXX {
        background-color: #58cc02;
        border: 2px solid #fff;
        border-radius: 50%;
        bottom: 3px;
        height: 17px;
        position: absolute;
        right: 0;
        width: 17px
    }

    ._3j1CI {
        display: grid;
        gap: 10px;
        grid-template-rows: auto
    }

    ._1o6AI {
        background-color: #fff;
        border: 2px solid #e5e5e5;
        border-radius: 50% 50% 50% 16%;
        height: 28px;
        position: absolute;
        right: -16px;
        top: -6px;
        transition: opacity .25s;
        width: 28px
    }

    ._2A_5L {
        background-color: #1cb0f6
    }

    ._254-x {
        background-color: #58cc02
    }

    ._1218t {
        height: 46px;
        left: 66px;
        top: -12px;
        width: 46px
    }

    ._1Zjvz {
        background-color: #58cc02
    }

    ._3ovXX {
        height: 26px;
        width: 26px
    }

    ._2H0n9,
    ._3ovXX {
        position: absolute;
        right: -1px;
        top: -1px
    }

    ._2H0n9 {
        height: 44px;
        width: 44px
    }

    ._2F26N {
        height: 36px;
        width: 36px
    }

    ._1atCZ,
    ._2F26N {
        position: absolute;
        right: 3px;
        top: 3px
    }

    ._1atCZ {
        height: 18px;
        width: 18px
    }

    ._1zzf2 {
        height: 24px;
        right: 1px;
        top: 1px;
        width: 24px
    }

    ._1zzf2,
    .BU87q {
        position: absolute
    }

    .BU87q {
        height: 40px;
        right: 2px;
        top: 2px;
        width: 40px
    }

    .Vsk4Y {
        right: 1px;
        top: 3px
    }

    .rUptq,
    .Vsk4Y {
        position: absolute
    }

    .rUptq {
        right: 2px;
        top: 6px
    }

    ._2RifW {
        --web-ui_button-height: 48px;
        --web-ui_button-padding: 0;
        --web-ui_button-border-radius: 12px;
        width: 48px
    }

    ._2gFUC {
        --web-ui_button-background-color: #ddf4ff;
        --web-ui_button-border-color: #84d8ff
    }

    ._2wsQR {
        --web-ui_button-background-color: #58cc02
    }

    ._1q8gS {
        --web-ui_button-border-color: #84d8f...