.post-text,
.entry-lead,
.entry-body,
[data-ink] { position: relative; }

.post-ink {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
    z-index: 1;
}

.post-ink g {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.post-ink .ink-strike { stroke: var(--mark-red-pure); }

.post-ink .ink-wash {
    stroke: var(--ink);
    opacity: 0.9;
}

@keyframes ink-draw {
    from { stroke-dashoffset: 1; }
    to   { stroke-dashoffset: 0; }
}

.post-ink .ink-draw path {
    stroke-dasharray: 1;
    animation: ink-draw 0.34s ease-out both;
}

s.inked { text-decoration: none; }

.post-spoiler {
    background: rgb(var(--ink-rgb) / 0.2);
    color: transparent;
    border-radius: 5px;
    padding: 0 4px;
    cursor: pointer;
    user-select: none;
}

.post-spoiler.inked {
    background: none;
    padding: 0;
}

.post-spoiler.is-opening {
    color: inherit;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(
        90deg,
        currentColor var(--ink-open, 0%),
        transparent var(--ink-open, 0%)
    );
    -webkit-background-clip: text;
    background-clip: text;
}

.post-spoiler.revealed,
.post-spoiler.inked.revealed {
    background: none;
    background-image: none;
    padding: 0;
    color: inherit;
    -webkit-text-fill-color: currentColor;
    user-select: text;
}

@media (prefers-reduced-motion: reduce) {
    .post-ink .ink-draw path { animation: none; }
}