/* Collapsible pre blocks inside article content */
.pre-toggle-container {
    position: relative;
    margin-bottom: 1rem;
}
.pre-toggle-container .pre-box {
    overflow: hidden;
    transition: max-height 0.22s ease;
    max-height: 10em; /* collapsed height */
    /* keep wrapper transparent so existing pre styles are preserved */
    border-radius: 0;
    background: transparent;
    padding: 0;
}
.pre-toggle-container:not(.collapsed) .pre-box {
    max-height: 2000px;
}
.pre-toggle-fade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4.2em;
    pointer-events: none;
    /* fade to match the article pre background (rgba(0,40,0,0.85) used in copy-box-content) */
    background: linear-gradient(transparent, rgba(0, 40, 0, 0.95));
    opacity: 0;
    transition: opacity 180ms ease;
    z-index: 5;
}

.pre-toggle-container.collapsed .pre-toggle-fade {
    opacity: 1;
}
.pre-toggle-btn {
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 10;
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    border: none;
    padding: 6px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9rem;
}
.pre-toggle-btn:focus {
    outline: 2px solid #66f;
}

@media (prefers-color-scheme: dark) {
    .pre-toggle-container .pre-box {
        background: #0b0b0b;
        color: #ddd;
    }
    .pre-toggle-fade {
        background: linear-gradient(transparent, #0b0b0b);
    }
    .pre-toggle-btn {
        background: rgba(255, 255, 255, 0.12);
        color: #fff;
    }
}