
.ld-content {
    position: relative;
    overflow: hidden;
    max-width: 640px;
    margin: 32px auto 48px;
    padding: 30px 28px 42px;
    color: #a6abb0;
    font: 15px/1.7 Arial, Helvetica, sans-serif;
    background:
        radial-gradient(circle at 68% 34%, rgba(0, 255, 157, .08), transparent 24rem),
        radial-gradient(circle at 18% 78%, rgba(138, 92, 255, .06), transparent 22rem),
        #1d1d1d;
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 4px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, .42);
}

.ld-content h1,
.ld-content h2 {
    color: #b8bdc2;
    line-height: 1.25;
}

.ld-content h1 {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
}

.ld-content h2 {
    margin-top: 34px;
}

.ld-content p,
.ld-content li {
    color: #a6abb0;
}

.ld-content a {
    color: #0798e6;
}

.ld-content hr {
    border: 0;
    border-top: 1px solid #3a3a3a;
    margin: 26px 0;
}

.ld-content li {
    margin: 7px 0;
    transition: transform .2s, text-shadow .2s;
}

.ld-content li:hover {
    transform: translateX(5px);
    text-shadow: 0 0 9px rgba(0, 255, 157, .2);
}
.ld-content strong {
    color: #c7ccd0;
}

.ld-reveal {
    opacity: 1 !important;
    transform: none !important;
}
}

.ld-reveal.ld-visible {
    opacity: 1;
    transform: translateY(0);
}

.ld-notice {
    padding: 12px 16px;
    border-left: 2px solid #00ff9d;
    background: rgba(0, 255, 157, .04);
}

.ld-progress {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: #00ff9d;
    box-shadow: 0 0 12px #00ff9d;
}

@media (max-width: 600px) {
    .ld-content {
        margin: 14px 10px 32px;
        padding: 22px 18px 32px;
    }
}
