.snm{
    border:1px solid #000000;
    margin-bottom: 12px;
    border-radius:12px;
    padding:16px 16px 12px;
    background:#17212f;
    position:relative;
}

.snm__text{
    --lines: 6;
    display: -webkit-box;
    -webkit-line-clamp: var(--lines);
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
    padding: 10px;
}

.snm__text h1 {
    font-size: 30px;
}

.snm__text p {
    margin-top: 0;
    margin-bottom: 1em;
}

.snm__text ol {
    margin: 0 0 1em 1.5em;
    padding-left: 1.5em;
}

.snm__text ol li {
    margin-bottom: 0.5em;
}

.snm[data-expanded="false"] .snm__text::after{
    content:"";
    position:absolute;
    left:0; right:0; bottom:0;
    height:3.2rem;
    background: linear-gradient(to bottom, rgba(255,255,255,0), #17212f 60%);
}

.snm[data-expanded="true"] .snm__text{
    display:block;
    -webkit-line-clamp: unset;
    overflow: visible;
}
.snm[data-expanded="true"] .snm__text::after{ display:none; }

.snm__toggle{
    display:inline-block;
    margin-top:10px;
    text-decoration:none;
    font-weight:600;
    border:1px solid #d1d5db;
    padding:6px 12px;
    border-radius:9999px;
}
.snm__toggle:hover{ background:#f9fafb; }
.snm__toggle:focus{ outline:2px solid #2563eb; outline-offset:2px; }