/* Dibujos repetidos del fondo. El negro del SVG es la máscara; el color sale de --ink. */
.pat-puntos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Ccircle cx='3' cy='3' r='1.35' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 18px 18px; }
.pat-puntos-finos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Ccircle cx='1.5' cy='1.5' r='.7' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 10px 10px; }
.pat-puntos-grandes { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Ccircle cx='6' cy='6' r='2.6' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 28px 28px; }
.pat-puntos-sueltos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46'%3E%3Ccircle cx='8' cy='10' r='1.5' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 46px 46px; }
.pat-lunares { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36'%3E%3Ccircle cx='10' cy='10' r='5' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 36px 36px; }
.pat-rayas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 1h8' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 8px 8px; }
.pat-rayas-finas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M0 .5h6' stroke='%23000' stroke-width='.5'/%3E%3C/svg%3E"); --pat-size: 6px 6px; }
.pat-rayas-verticales { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Cpath d='M1 0v10' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 10px 10px; }
.pat-rayas-diagonales { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M-2 12L12-2M-2 6L6-2M6 12L12 6' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 12px 12px; }
.pat-rayas-suaves { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M0 3h16' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E"); --pat-size: 16px 16px; }
.pat-punteado { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10'%3E%3Cpath d='M0 2h4M8 2h4' stroke='%23000' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); --pat-size: 14px 10px; }
.pat-guiones { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='14'%3E%3Cpath d='M2 4h8' stroke='%23000' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E"); --pat-size: 22px 14px; }
.pat-cuadricula { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M0 .5h16M.5 0v16' stroke='%23000' stroke-width='.6'/%3E%3C/svg%3E"); --pat-size: 16px 16px; }
.pat-cuadros { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Crect x='3' y='3' width='8' height='8' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 24px 24px; }
.pat-rombos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22'%3E%3Cpath d='M11 2l6 9-6 9-6-9z' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 22px 22px; }
.pat-cruzadas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath d='M0 14L14 0M0 0L14 14' stroke='%23000' stroke-width='.7'/%3E%3C/svg%3E"); --pat-size: 14px 14px; }
.pat-chevron { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='12'%3E%3Cpath d='M0 9l10-7 10 7' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E"); --pat-size: 20px 12px; }
.pat-zigzag { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12'%3E%3Cpath d='M0 9l6-6 6 6 6-6 6 6' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E"); --pat-size: 24px 12px; }
.pat-ondas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='14'%3E%3Cpath d='M0 8c4-6 8-6 12 0s8 6 12 0 8-6 12 0' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E"); --pat-size: 32px 14px; }
.pat-circulos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='8' cy='8' r='4.5' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 26px 26px; }
.pat-anillos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='10' cy='10' r='3' fill='none' stroke='%23000' stroke-width='1'/%3E%3Ccircle cx='10' cy='10' r='6.5' fill='none' stroke='%23000' stroke-width='.8'/%3E%3C/svg%3E"); --pat-size: 32px 32px; }
.pat-estrellas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Cpath d='M8 1.5l1.5 4.2h4.4l-3.5 2.6 1.3 4.2L8 10.1 4.3 12.5l1.3-4.2L2.1 5.7h4.4z' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 28px 28px; }
.pat-destellos { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M8 1v6M8 9v6M1 8h6M9 8h6' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 24px 24px; }
.pat-corazones { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='26'%3E%3Cpath d='M8 14C3 10 2 6 4.2 4.2 6 2.6 8 3.6 8 3.6S10 2.6 11.8 4.2C14 6 13 10 8 14z' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 28px 26px; }
.pat-flores { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Ccircle cx='8' cy='4.2' r='2' fill='%23000'/%3E%3Ccircle cx='11.4' cy='6.8' r='2' fill='%23000'/%3E%3Ccircle cx='10' cy='10.6' r='2' fill='%23000'/%3E%3Ccircle cx='6' cy='10.6' r='2' fill='%23000'/%3E%3Ccircle cx='4.6' cy='6.8' r='2' fill='%23000'/%3E%3Ccircle cx='8' cy='7.4' r='1.3' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 28px 28px; }
.pat-hojas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Cpath d='M6 16c6-1 10-8 10-12-6 1-10 8-10 12z' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 26px 26px; }
.pat-confeti { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30'%3E%3Crect x='4' y='5' width='3' height='6' rx='.4' transform='rotate(20 5 8)' fill='%23000'/%3E%3Crect x='16' y='12' width='2.4' height='5' rx='.4' transform='rotate(-30 17 14)' fill='%23000'/%3E%3Ccircle cx='12' cy='8' r='1.2' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 30px 30px; }
.pat-burbujas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34'%3E%3Ccircle cx='8' cy='9' r='4' fill='none' stroke='%23000' stroke-width='1'/%3E%3Ccircle cx='18' cy='16' r='2.2' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 34px 34px; }
.pat-espigas { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M0 8l8-8M8 16l8-8M0 16l8-8M8 8l8-8' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E"); --pat-size: 16px 16px; }
.pat-trama { --pat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Ccircle cx='2' cy='2' r='1.1' fill='%23000'/%3E%3Ccircle cx='10' cy='10' r='1.1' fill='%23000'/%3E%3C/svg%3E"); --pat-size: 16px 16px; }

.pat-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-color: var(--ink, #241e18);
    -webkit-mask-image: var(--pat);
    mask-image: var(--pat);
    -webkit-mask-size: var(--pat-size, 22px 22px);
    mask-size: var(--pat-size, 22px 22px);
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
    opacity: .34;
}