@font-face{font-family:UnboundedCompacta;src:url(unbounded-extrabold.woff) format("woff");font-weight:400;font-style:normal;font-display:swap;size-adjust:72%}
/* PÁGINAS EXTRA · el estilo nuevo (hueso, papel, UnboundedCompacta y píldoras) en:
   - sobre.html (Escanear estampa / abrir el sobre)
   - album-publico.html (Regálame uno: el álbum que alguien comparte)
   - estampas.html (Panel: estampas del pedido para imprimir; SOLO la pantalla, lo impreso no cambia)
   Antes eran negras. Para quitarlo: borra este archivo y su línea en esas tres páginas. */
:root{--px-bone:#eeede8;--px-paper:#f7f6f2;--px-ink:#151412;--px-mute:#6b675e;--px-line:#d9d6cd;--px-or:#ff8346;--px-or-ink:#c4521c;--px-display:UnboundedCompacta,Impact,"Arial Narrow",sans-serif;--px-body:Raleway,Arial,sans-serif}

/* ================= SOBRE PEYOTE (escanear estampa) ================= */
html body.sobre-page{background:var(--px-bone)!important;color:var(--px-ink)!important}
body.sobre-page .sb-top img{content:url('logo-peyote.webp')}
body.sobre-page .sb-album{color:var(--px-ink)!important;border:1.5px solid var(--px-ink)!important;font:800 13px/1 var(--px-body)!important;letter-spacing:0!important;text-transform:none!important;padding:10px 14px!important}
body.sobre-page .sb-album:hover{background:var(--px-ink)!important;color:var(--px-bone)!important}
body.sobre-page .sb-k{color:var(--px-or-ink)!important;font:700 12px/1 var(--px-body)!important;letter-spacing:.08em!important}
body.sobre-page .sb-k::before{background:var(--px-or)!important}
body.sobre-page .sb-load p,body.sobre-page .sb-how,body.sobre-page .sb-note{color:var(--px-mute)!important}
body.sobre-page .sb-how{font:700 12px/1.3 var(--px-body)!important;letter-spacing:.06em!important}
body.sobre-page .sb-t,body.sobre-page .sb-msg,body.sobre-page .sb-done h1,body.sobre-page .sb-error h1{color:var(--px-ink)!important;font-family:var(--px-display)!important;font-weight:400!important;text-transform:uppercase!important;letter-spacing:.01em!important}
body.sobre-page .sb-done h1,body.sobre-page .sb-error h1{font-size:clamp(2.4rem,7vw,3.6rem)!important;line-height:.95!important}
body.sobre-page .sb-done p,body.sobre-page .sb-error p{color:var(--px-mute)!important;font-weight:600}
body.sobre-page .sb-done p b{color:var(--px-ink)!important}
body.sobre-page .sb-card{filter:drop-shadow(0 22px 28px rgba(21,20,18,.25))!important}
/* Los rayos que giraban detrás de la estampa: fuera */
body.sobre-page .sb-rays{display:none!important}
body.sobre-page .sb-btn,body.sobre-page .sb-form button{border-radius:999px!important;background:var(--px-or)!important;color:var(--px-ink)!important;font:800 15px/1 var(--px-body)!important;letter-spacing:0!important;text-transform:none!important;padding:14px 20px!important;transition:background .2s,color .2s,transform .2s}
body.sobre-page .sb-btn:hover,body.sobre-page .sb-form button:hover{background:var(--px-ink)!important;color:var(--px-bone)!important;transform:translateY(-2px)}
body.sobre-page .sb-link{color:var(--px-ink)!important}
body.sobre-page .sb-mini{border:0!important;box-shadow:0 18px 40px rgba(21,20,18,.14)}
body.sobre-page .sb-form label{color:var(--px-mute)!important;font:700 12px/1.3 var(--px-body)!important;letter-spacing:.04em!important;text-transform:none!important}
body.sobre-page .sb-form input{background:#fff!important;color:var(--px-ink)!important;border:1.5px solid var(--px-line)!important;border-radius:999px!important;padding:13px 18px!important}
body.sobre-page .sb-form input:focus{border-color:var(--px-ink)!important;box-shadow:0 0 0 3px rgba(255,131,70,.35)!important;outline:0!important}
body.sobre-page .sb-help a{color:var(--px-or-ink)!important;font-weight:700}
body.sobre-page .sb-gift{background:var(--px-paper)!important}
body.sobre-page .sb-gift p{color:var(--px-ink)!important}
body.sobre-page .sb-gift cite{color:var(--px-or-ink)!important;font:700 12px/1 var(--px-body)!important}
body.sobre-page .sb-botH small{font-family:var(--px-body)!important;font-weight:700!important}

/* ================= REGÁLAME UNO (álbum que alguien comparte) ================= */
html body.rg-page{background:var(--px-bone)!important;color:var(--px-ink)!important}
body.rg-page .rg-head{background:var(--px-bone)!important;border-bottom:1px solid var(--px-line)!important}
body.rg-page .rg-bar img{content:url('logo-peyote.webp')}
body.rg-page .rg-shop{color:var(--px-ink)!important;border:1.5px solid var(--px-ink)!important;font:800 13px/1 var(--px-body)!important;letter-spacing:0!important;text-transform:none!important;padding:10px 14px!important}
body.rg-page .rg-shop:hover{background:var(--px-ink)!important;color:var(--px-bone)!important}
body.rg-page .rg-k{color:var(--px-or-ink)!important;font:700 12px/1 var(--px-body)!important;letter-spacing:.08em!important}
body.rg-page .rg-k::before{background:var(--px-or)!important}
body.rg-page .rg-hero h1{color:var(--px-ink)!important;font:400 clamp(52px,10vw,120px)/.88 var(--px-display)!important;letter-spacing:0!important;text-transform:uppercase!important}
body.rg-page .rg-hero p{color:var(--px-mute)!important;font-weight:600}
body.rg-page .rg-stats{border:0!important;background:var(--px-paper)!important;border-radius:20px!important}
body.rg-page .rg-stats div{border-color:var(--px-line)!important}
body.rg-page .rg-stats b{font-family:var(--px-display)!important;font-weight:400!important;color:var(--px-ink)}
body.rg-page .rg-stats small{color:var(--px-mute)!important;font:700 11px/1 var(--px-body)!important;letter-spacing:.06em!important}
body.rg-page .rg-stats .lv,body.rg-page .rg-stats .lv b{background:var(--px-or)!important;color:var(--px-ink)!important}
body.rg-page .rg-dead{background:var(--px-paper)!important;color:var(--px-ink)!important}
body.rg-page .rg-owner{border-color:var(--px-mute)!important;color:var(--px-mute)!important}
body.rg-page .rg-item{background:var(--px-paper)!important;border:0!important;border-radius:20px!important;color:var(--px-ink)}
body.rg-page .rg-item:hover{transform:translateY(-3px)}
body.rg-page .rg-item .ph{background:#fff!important}
body.rg-page .rg-item .ph img{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
body.rg-page .rg-item:hover .ph img{transform:rotate(-3deg) scale(1.05)}
body.rg-page .rg-item .tx b{color:var(--px-ink)!important;font-weight:800}
body.rg-page .rg-item .tx small{color:var(--px-mute)!important;font:700 12px/1.3 var(--px-body)!important;letter-spacing:.02em!important}
body.rg-page .rg-item .go{border-radius:999px!important;font:800 14px/1 var(--px-body)!important;letter-spacing:0!important;text-transform:none!important}
body.rg-page .rg-item .go:hover{background:var(--px-ink)!important;color:var(--px-bone)!important}
body.rg-page .rg-item .tag{border-color:var(--px-mute)!important;color:var(--px-mute)!important}
body.rg-page .rg-empty{border-color:var(--px-line)!important;color:var(--px-mute)!important}
body.rg-page .rg-note{color:var(--px-mute)!important}

/* ================= ESTAMPAS DEL PEDIDO (panel, solo en pantalla) ================= */
@media screen{
  html body.estampas-page{background:var(--px-bone)!important;color:var(--px-ink)!important;font-family:var(--px-body)}
  body.estampas-page .bar{color:var(--px-ink)!important}
  body.estampas-page .tips,body.estampas-page .pair{border:0!important;border-radius:18px!important}
  body.estampas-page .bar h1{color:var(--px-ink)!important;font:400 clamp(36px,5vw,64px)/.92 var(--px-display)!important;letter-spacing:0!important;text-transform:uppercase!important}
  body.estampas-page .k{color:var(--px-or-ink)!important;font:700 12px/1 var(--px-body)!important;letter-spacing:.08em!important}
  body.estampas-page .bar input{background:#fff!important;color:var(--px-ink)!important;border:1.5px solid var(--px-line)!important;border-radius:999px!important;padding:11px 16px!important}
  body.estampas-page .bar button{border-radius:999px!important;font-family:var(--px-body)!important;font-weight:800!important;letter-spacing:0!important;text-transform:none!important}
  body.estampas-page .bar button[type=submit]{background:var(--px-or)!important;color:var(--px-ink)!important;border:0!important}
  body.estampas-page .msg,body.estampas-page .tips{color:var(--px-mute)!important}
  body.estampas-page .msg.err{color:#b3261e!important}
  body.estampas-page .tips b{color:var(--px-ink)!important}
  body.estampas-page .pair p{color:var(--px-mute)!important}
}

/* ================= PÁGINAS POR PAÍS / EQUIPO (jerseys/*.html) ================= */
html body.tp-body{background:var(--px-bone)!important}
body.tp-body .tp-crumbs,body.tp-body .tp-eyebrow,body.tp-body .tp-facts span,body.tp-body .tp-meta,body.tp-body .tp-cy{font-family:var(--px-body)!important;font-weight:700!important;letter-spacing:.06em!important}
body.tp-body .tp-eyebrow{color:var(--px-or-ink)!important}
body.tp-body .tp-hero{border-top:2px solid var(--px-ink)!important}
body.tp-body .tp-hero h1{font:400 clamp(52px,7.4vw,108px)/.88 var(--px-display)!important;letter-spacing:0!important}
body.tp-body .tp-sub{font-family:var(--px-body)!important;font-weight:800!important;letter-spacing:.04em!important}
body.tp-body .tp-facts b,body.tp-body .tp-bar a,body.tp-body .tp-card .tp-cy{font-family:var(--px-display)!important;font-weight:400!important;letter-spacing:0!important}
body.tp-body .tp-bar{border-radius:16px;border:0!important;background:var(--px-paper)}
body.tp-body .tp-bar a{border-right-color:var(--px-line)!important}
body.tp-body .tp-bar a:hover{background:var(--px-ink)!important;color:var(--px-bone)!important}
body.tp-body .tp-card{border:0!important;border-radius:20px!important;background:var(--px-paper)!important;padding:12px!important;transition:transform .25s!important}
body.tp-body .tp-card:hover{transform:translateY(-3px)}
body.tp-body .tp-ph{border-radius:14px;overflow:hidden;background:#fff}
body.tp-body .tp-ph img{transition:transform .5s cubic-bezier(.2,.8,.2,1)!important}
body.tp-body .tp-card:hover .tp-ph img{transform:rotate(-3deg) scale(1.05)!important}
body.tp-body .tp-go{color:var(--px-or-ink)!important;font:800 12.5px/1 var(--px-body)!important;letter-spacing:.02em!important;text-transform:none!important}
body.tp-body .tp-chips a{border-radius:999px!important;border:1.5px solid var(--px-ink)!important;font:800 13px/1 var(--px-body)!important;letter-spacing:0!important;text-transform:none!important}
body.tp-body .tp-chips a:hover{background:var(--px-ink)!important;color:var(--px-bone)!important}
body.tp-body .tp-strip{border-radius:20px;overflow:hidden}
body.tp-body .tp-section-head h2{font-family:var(--px-display)!important;font-weight:400!important;letter-spacing:0!important;text-transform:uppercase}
@media(prefers-reduced-motion:reduce){body.tp-body .tp-card:hover,body.tp-body .tp-card:hover .tp-ph img{transform:none!important}}

/* Sobre: al pegarse, cae sobre el álbum el mismo sello "PEGADA" que en Mi álbum (solo CSS: arranca al aparecer la escena) */
body.sobre-page .sb-done .sb-mini{position:relative;overflow:visible!important}
body.sobre-page .sb-done:not([hidden]) .sb-mini::after{content:"Pegada";position:absolute;right:-10px;top:-14px;z-index:5;padding:6px 12px;border:3.5px solid #1f7a3f;border-radius:9px;background:rgba(247,246,242,.94);color:#1f7a3f;font:400 clamp(20px,3vw,28px)/1 var(--px-display);letter-spacing:.04em;text-transform:uppercase;pointer-events:none;transform:rotate(-9deg);animation:px-sello .6s cubic-bezier(.3,1.4,.5,1) .5s both}
@keyframes px-sello{0%{opacity:0;transform:rotate(-22deg) scale(2.4)}60%{opacity:1;transform:rotate(-7deg) scale(.92)}100%{opacity:1;transform:rotate(-9deg) scale(1)}}
@media(prefers-reduced-motion:reduce){body.sobre-page .sb-done:not([hidden]) .sb-mini::after{animation:none}}
@media(max-width:600px){body.sobre-page .sb-done:not([hidden]) .sb-mini::after{right:6px}}

/* Aviso de link (incompleto, en pausa, sin conexión): título más chico para que quepa en una sola línea. */
body.rg-page.rg-aviso .rg-hero h1{font-size:clamp(28px,6vw,72px)!important}
