/* EL SELLO DE LA CATEGORÍA · LA COLA 396 (DECISIONES C-95) · 2026-09-28 · core/views/sello_categoria.php
   Orden del propietario: «un diseño súper atractivo y más exclusivo según la categoría para esa etiqueta, y que no parezca IA».
   C-404 (2026-10-26, tercera vuelta): ni la placa pequeña de antes («de baja categoría») ni la cápsula de vidrio («no tiene estilo, no tiene
   clase»): una JOYA. Una cápsula de metal macizo con su luz arriba, su sombra abajo, su halo y la letra grabada; la faceta tallada en CSS
   (nunca un emoji). Cuanto más alta la categoría, más luz: Silver, plata cepillada; Gold, oro con su halo; Platinum, platino frío con doble
   filo; Diamante Ultra, ónix con filo tornasolado, letra irisada y la faceta encendida. Bronce (solo lo ven el admin y la modelo): cobre.
   La letra de joyería de siempre (Didot y Bodoni en iPhone y Mac, Georgia de reserva; ninguna descarga), en versales espaciadas. Sin imágenes
   ni animaciones: pesa lo mismo en un iPhone viejo. Contraste medido (regla 53): la letra va sobre su propio metal, no sobre la foto. */
.pe-sello {
    --sello-tinta: #1d1d20;
    --sello-borde: rgba(255, 255, 255, .6);
    --sello-halo: rgba(0, 0, 0, 0);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 26px;
    padding: 0 13px 0 10px;
    border: 1px solid var(--sello-borde);
    border-radius: 999px;
    color: var(--sello-tinta);
    font: 700 10.5px/1 Didot, "Bodoni 72", "Bodoni MT", "Playfair Display", Georgia, "Times New Roman", serif;
    letter-spacing: .18em;
    text-transform: uppercase;
    white-space: nowrap;
    vertical-align: middle;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 -1px 0 rgba(0, 0, 0, .25), 0 3px 12px var(--sello-halo), 0 3px 10px rgba(0, 0, 0, .45);
    -webkit-font-smoothing: antialiased;
    -webkit-user-select: none;
    user-select: none;
}
.pe-sello__texto { position: relative; top: .5px; }
.pe-sello__faceta {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    transform: rotate(45deg);
    background: currentColor;
    box-shadow: inset -1px -1px 0 rgba(0, 0, 0, .28), inset 1px 1px 0 rgba(255, 255, 255, .55);
}

/* Bronce: cobre bruñido (interno; la letra clara sobre el metal hondo: 5,3:1) */
.pe-sello--bronce {
    --sello-tinta: #fff4ea;
    --sello-borde: #e3ae80;
    background: linear-gradient(180deg, #8e5a32 0%, #7a4724 47%, #683a1b 53%, #855330 100%);
    text-shadow: 0 1px 0 rgba(60, 25, 5, .45);
}
.pe-sello--bronce .pe-sello__faceta { background: linear-gradient(135deg, #ffd9b8, #8c552d); }

/* Silver: plata cepillada */
.pe-sello--silver {
    --sello-tinta: #22252a;
    --sello-borde: #ffffff;
    background:
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .12) 0 1px, rgba(0, 0, 0, 0) 1px 3px),
        linear-gradient(180deg, #ffffff 0%, #e3e6ea 40%, #b9bec5 60%, #eef0f3 100%);
}
.pe-sello--silver .pe-sello__faceta { background: linear-gradient(135deg, #ffffff, #7d838b); box-shadow: 0 0 0 1px rgba(40, 45, 50, .3); }

/* Gold: oro, con su halo */
.pe-sello--gold {
    --sello-tinta: #3b2a06;
    --sello-borde: #fff1bf;
    --sello-halo: rgba(201, 154, 46, .38);
    background: linear-gradient(180deg, #fff4c8 0%, #f0cf6a 38%, #c99a2e 62%, #f5dc8a 100%);
    box-shadow: inset 0 1px 0 rgba(255, 250, 230, .9), inset 0 -1px 0 rgba(110, 75, 5, .45), 0 3px 12px var(--sello-halo), 0 3px 10px rgba(0, 0, 0, .45);
}
.pe-sello--gold .pe-sello__faceta { background: linear-gradient(135deg, #fffbe8 0%, #b8862a 100%); box-shadow: 0 0 0 1px rgba(90, 60, 5, .35); }

/* Platinum: platino frío, con un segundo filo interior */
.pe-sello--platinum {
    --sello-tinta: #14212b;
    --sello-borde: #ffffff;
    --sello-halo: rgba(170, 195, 215, .32);
    background: linear-gradient(180deg, #fbfdff 0%, #d9e3ea 40%, #a9b9c6 60%, #edf3f7 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .6), inset 0 -1px 0 rgba(30, 50, 70, .3), 0 3px 12px var(--sello-halo), 0 3px 10px rgba(0, 0, 0, .45);
}
.pe-sello--platinum .pe-sello__faceta { background: linear-gradient(135deg, #ffffff 0%, #a9bccb 60%, #5f7584 100%); box-shadow: 0 0 0 1px rgba(20, 40, 60, .3); }

/* Diamante Ultra: ónix con filo tornasolado, letra irisada y la faceta encendida */
.pe-sello--diamond {
    --sello-tinta: #ffffff;
    --sello-halo: rgba(165, 225, 255, .35);
    gap: 9px;
    padding: 0 14px 0 10px;
    border: 1px solid transparent;
    background:
        linear-gradient(180deg, #24242c 0%, #08080b 100%) padding-box,
        linear-gradient(115deg, #b9f2ff 0%, #ffffff 22%, #e6c8ff 48%, #a6e4ff 74%, #ffffff 100%) border-box;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .6), 0 0 16px var(--sello-halo), 0 3px 10px rgba(0, 0, 0, .5);
    letter-spacing: .2em;
}
.pe-sello--diamond .pe-sello__texto {
    color: #fff;
    background: linear-gradient(100deg, #ffffff 0%, #d2f1ff 32%, #f2ddff 64%, #ffffff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pe-sello--diamond .pe-sello__faceta {
    width: 9px;
    height: 9px;
    background: conic-gradient(from 45deg, #ffffff, #a6e4ff, #e6c8ff, #ffffff, #b9f2ff, #ffffff);
    box-shadow: 0 0 8px rgba(185, 242, 255, .8), inset 0 0 0 1px rgba(255, 255, 255, .5);
}

/* Donde va: sobre la foto de la tarjeta, junto al nombre en la ficha, en los filtros del catálogo y en los paneles */
.pe-ficha__sello { display: block; margin: 0 0 8px; }
.qpill .pe-sello { pointer-events: none; }
@media (prefers-contrast: more) { .pe-sello { border-color: currentColor; } }
@media print { .pe-sello { box-shadow: none; } }