<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" fill="#1B1319">
    <style>
        .preview {
            display: none;
        }

        @media only screen and (max-width: 130px) and (max-height: 55px) {
            .shape {
                display: none;
            }
            .preview {
                display: block;
            }
        }
    </style>
    <g class="shape">
        <svg viewBox="0 0 64 64" preserveAspectRatio="none" width="100%" height="64">
            <polygon points="0,0 64,0 64,24 0,64"/>
        </svg>
        <svg viewBox="0 0 64 64" preserveAspectRatio="none" width="64" height="100%">
            <polygon points="0,0 0,64 24,64 64,0"/>
        </svg>
        <g transform="translate(0 -64)">
            <svg viewBox="0 0 64 64" preserveAspectRatio="none" width="100%" height="64" y="100%">
                <polygon points="0,64 64,64 64,0 0,40"/>
            </svg>
        </g>
        <g transform="translate(-64 0)">
            <svg viewBox="0 0 64 64" preserveAspectRatio="none" width="64" height="100%" x="100%">
                <polygon points="0,64 64,64 64,0 40,0"/>
            </svg>
        </g>
    </g>
    <g class="preview">
        <svg viewBox="0 0 12 12" preserveAspectRatio="none" width="100%" height="12">
            <polygon points="0,0 12,0 12,6 0,12"/>
        </svg>
        <svg viewBox="0 0 12 12" preserveAspectRatio="none" width="12" height="100%">
            <polygon points="0,0 0,12 6,12 12,0"/>
        </svg>
        <g transform="translate(0 -12)">
            <svg viewBox="0 0 12 12" preserveAspectRatio="none" width="100%" height="12" y="100%">
                <polygon points="0,12 12,12 12,0 0,6"/>
            </svg>
        </g>
        <g transform="translate(-12 0)">
            <svg viewBox="0 0 12 12" preserveAspectRatio="none" width="12" height="100%" x="100%">
                <polygon points="0,12 12,12 12,0 6,0"/>
            </svg>
        </g>
    </g>
</svg>
