@font-face{font-family:UnboundedCompacta;src:url(unbounded-extrabold.woff) format("woff");font-weight:400;font-style:normal;font-display:swap;size-adjust:72%}
/* Mi álbum · banner limpio (propuesta A).
   Esta hoja va AL FINAL en mi-coleccion.html. Solo cambia la parte de arriba:
   banner, pestañas y filtros. No toca las tarjetas ni lo que hace ningún botón.
   Para volver atrás: quita el <link> de este archivo en mi-coleccion.html. */

/* 1) Letreros chiquitos escondidos (siguen en el HTML para Google, pero no se ven) */
html body.collection-page .collection-page-head .collection-kicker,
html body.collection-page .collection-status-tabs .collection-tab-kicker,
html body.collection-page .collection-filter-label,
html body.collection-page .collection-intro .rc-meter small{
  position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}

/* 2) Banner: título a la izquierda, tarjeta crema a la derecha */
html body.collection-page .collection-page-main .collection-page-head{
  display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px 40px;
  padding:34px 0 30px!important}
html body.collection-page .collection-page-main .collection-page-head::after{display:none!important}
html body.collection-page .collection-page-head h1{
  font-family:UnboundedCompacta,Impact,"Arial Narrow",sans-serif!important;font-weight:400!important;
  font-size:clamp(54px,8vw,92px)!important;line-height:.95!important;letter-spacing:.01em!important;margin:0!important;
  text-shadow:4px 4px 0 var(--rt-ink)!important}
html body.collection-page .collection-page-main .collection-header-support{
  flex:0 1 600px;min-width:min(100%,300px);margin:0!important;padding:16px 20px!important;
  display:flex!important;flex-wrap:wrap;align-items:center;gap:12px!important;
  border:3px solid var(--rt-ink)!important;border-radius:14px!important;box-shadow:5px 5px 0 var(--rt-ink)!important}
html body.collection-page .collection-header-support::before,
html body.collection-page .collection-header-support::after{display:none!important}
html body.collection-page .collection-intro{display:contents}
html body.collection-page .collection-page-main .collection-intro strong{font-size:14px!important;font-weight:700!important}
html body.collection-page .collection-page-main .collection-intro p{flex:0 0 100%;order:1;margin:0!important;font-size:14px;line-height:1.4;font-weight:600}
html body.collection-page .collection-intro .rc-meter{flex:0 0 100%;order:2;margin:0;max-width:none}
html body.collection-page .collection-intro .rc-bar{height:10px}
html body.collection-page .collection-intro .collection-cloud-nudge{order:5;margin:0;font-size:13px;font-weight:700;text-decoration:underline}
html body.collection-page .collection-intro .collection-cloud-nudge[hidden]{display:none}
html body.collection-page .collection-subline{flex:0 0 auto;order:3}
html body.collection-page .collection-page-main .collection-subline strong{font:700 13px/1 Raleway,Arial,sans-serif!important;letter-spacing:0!important;padding:8px 14px!important;text-transform:none}
html body.collection-page .collection-header-support .cs-open{flex:0 0 auto;order:4;font:700 13px/1 Raleway,Arial,sans-serif!important;letter-spacing:0!important;padding:8px 14px!important;box-shadow:none!important}

/* 3) Pestañas: botones redondos sobre la franja azul */
html body.collection-page .collection-status-tabs{
  display:flex!important;flex-wrap:wrap;gap:10px!important;padding:14px 0!important;margin-top:0!important;
  box-shadow:0 0 0 100vmax var(--rt-sky)!important;clip-path:inset(0 -100vmax)!important}
html body.collection-page .collection-status-tabs::after{height:3px!important}
html body.collection-page .collection-status-tabs button{
  flex:0 0 auto;flex-direction:row!important;align-items:center!important;min-height:0!important;white-space:nowrap;
  border:2px solid var(--rt-ink)!important;border-radius:99px!important;padding:9px 18px!important;margin:0!important;gap:0!important}
html body.collection-page .collection-status-tabs button strong{font:800 14px/1 Raleway,Arial,sans-serif!important;letter-spacing:0!important;text-transform:none}
html body.collection-page .collection-status-tabs button strong i{display:none}
html body.collection-page .collection-status-tabs button strong span{opacity:.55;margin-left:6px}
html body.collection-page .collection-status-tabs button[aria-selected="true"]{
  background:var(--rt-yel)!important;box-shadow:3px 3px 0 var(--rt-ink)!important;margin:0!important;padding-bottom:9px!important}
html body.collection-page .collection-status-tabs button[aria-selected="true"] strong span{opacity:1}

/* ===== 4) STATS: más compacta y sin letreros chiquitos ===== */
html body.collection-page .stats-content .collection-kicker,
html body.collection-page .stats-page-head > p:not(.collection-kicker),
html body.collection-page .stats-page-head > small,
html body.collection-page .stats-shirt small,
html body.collection-page .stats-oldest small,
html body.collection-page .stats-badge small.x{
  position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
html body.collection-page .stats-content{padding-bottom:30px}
html body.collection-page .stats-page-head{padding:22px 0 0!important;margin:0!important;border:0!important}
html body.collection-page .stats-page-head h2{font-size:clamp(26px,3.4vw,36px)!important;margin:0!important}
/* títulos de sección más chicos y pegados a su contenido */
html body.collection-page .stats-section{padding:22px 0 24px!important}
html body.collection-page .stats-section-heading{margin-bottom:12px!important;gap:6px!important;align-items:baseline!important}
html body.collection-page .stats-section-heading h2{font-size:clamp(22px,2.8vw,30px)!important;margin:0!important}
html body.collection-page .stats-section-heading > div{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap}
html body.collection-page .stats-section-note{margin:0!important;font-size:12px!important}
/* los 4 números: número a la izquierda, texto a la derecha, sin encimarse */
html body.collection-page .stats-number-grid{margin-top:14px!important;gap:12px!important}
html body.collection-page .stats-content .stats-number{
  display:flex!important;flex-direction:row!important;align-items:center!important;gap:12px!important;
  min-height:0!important;height:auto!important;padding:14px 18px!important}
html body.collection-page .stats-content .stats-number strong{
  position:static!important;margin:0!important;font-size:clamp(34px,4vw,46px)!important;line-height:1!important;flex:0 0 auto}
html body.collection-page .stats-content .stats-number span{position:static!important;margin:0!important;font-size:11px!important;line-height:1.3!important}
/* nivel */
html body.collection-page .stats-level{padding:14px 20px!important;margin-top:12px!important;gap:16px!important;min-height:0!important}
html body.collection-page .stats-level-emblem{width:64px!important;height:64px!important;flex:0 0 auto}
html body.collection-page .stats-level-emblem b{font-size:26px!important}
html body.collection-page .stats-level h3{font-size:clamp(26px,3.2vw,34px)!important;margin:0 0 8px!important}
html body.collection-page .stats-level-note{margin:8px 0 0!important}
html body.collection-page .stats-level-steps{margin-top:8px!important}
/* siguiente jersey */
html body.collection-page .stats-next{padding:14px 20px!important;margin-top:12px!important;gap:20px!important;min-height:0!important}
html body.collection-page .stats-next-photo{width:96px!important;flex:0 0 96px!important}
html body.collection-page .stats-next h3{font-size:clamp(20px,2.4vw,26px)!important;margin:0 0 4px!important}
html body.collection-page .stats-next-copy p{margin:0 0 8px!important}
/* tu archivo en una mirada */
html body.collection-page .stats-highlights{gap:12px!important}
html body.collection-page .stats-highlight{padding:12px 14px!important;min-height:0!important;gap:4px!important}
html body.collection-page .stats-highlight strong{font-size:clamp(20px,2.2vw,28px)!important;line-height:1.05!important;margin:0!important}
html body.collection-page .stats-highlight.stats-decade-highlight strong{font-size:clamp(30px,3.4vw,42px)!important}
html body.collection-page .stats-highlight p{margin:0!important;font-size:10px!important}
html body.collection-page .stats-highlight span{font-size:12px!important;line-height:1.35!important;margin:0!important}
html body.collection-page .stats-oldest img{display:none!important}
html body.collection-page .stats-decade-block{margin-top:12px!important;padding:12px 16px!important;max-width:none!important;width:100%!important}
html body.collection-page .stats-decade-block h3{margin:0 0 8px!important}
html body.collection-page .stats-decade-block .stats-bars{gap:8px!important}
html body.collection-page .stats-decade-list.is-hint{display:none!important}
/* 5 estrellas: miniaturas en una fila */
html body.collection-page .stats-five-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important}
html body.collection-page .stats-shirt{padding:10px 12px!important;gap:6px!important;min-height:0!important}
html body.collection-page .stats-shirt img{height:110px!important;width:100%!important;object-fit:contain!important;margin:0!important}
html body.collection-page .stats-shirt span{font-size:12px!important;line-height:1.25!important}
html body.collection-page .stats-shirt b{margin:0!important;font-size:12px!important}
/* calificaciones */
html body.collection-page .stats-rating-layout{gap:20px 40px!important;align-items:center!important}
html body.collection-page .stats-average{gap:6px!important}
html body.collection-page .stats-average>strong{font-size:clamp(40px,5vw,56px)!important;line-height:1!important;margin:0!important}
html body.collection-page .stats-average-stars{display:block!important;position:static!important;margin:4px 0 0!important}
html body.collection-page .stats-average>span{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
html body.collection-page .stats-bars{gap:8px!important}
/* logros */
html body.collection-page .stats-badge-grid{gap:10px!important}
html body.collection-page .stats-badge{padding:10px 12px!important;gap:10px!important;min-height:0!important}
html body.collection-page .stats-badge-icon{width:34px!important;height:34px!important;flex:0 0 34px}
html body.collection-page .stats-badge.is-earned small{display:none!important}
html body.collection-page .stats-badge strong{font-size:13px!important}
html body.collection-page .stats-badge span:not(.stats-badge-icon){font-size:12px!important;line-height:1.3!important}
/* tarjeta de coleccionista */
html body.collection-page .stats-share{padding:14px 16px!important;gap:10px!important}
html body.collection-page .stats-shirt{display:flex!important;flex-direction:column!important;align-items:stretch}
html body.collection-page .stats-shirt img{flex:0 0 auto;height:120px!important;padding:6px!important}
html body.collection-page .stats-shirt span{padding-top:6px!important}
html body.collection-page .stats-shirt b{padding-top:4px!important}
html body.collection-page .stats-five-grid{align-items:start!important}
@media(max-width:700px){
  html body.collection-page .stats-five-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body.collection-page .stats-content .stats-number{padding:12px 14px!important}
  html body.collection-page .stats-badge-grid{grid-template-columns:1fr 1fr!important}
}
/* arreglo del banner: la frase en un solo renglón y el enlace de la nube junto a los botones */
html body.collection-page .collection-page-main .collection-intro strong{display:inline!important;margin:0!important}
html body.collection-page .collection-intro .collection-cloud-nudge{flex:0 0 auto!important;width:auto!important;display:inline-block!important;white-space:nowrap}
html body.collection-page .collection-intro .collection-cloud-nudge[hidden]{display:none!important}
html body.collection-page .collection-page-main .collection-intro p{max-width:none!important}
html body.collection-page .collection-page-main .collection-header-support{gap:12px 10px!important;padding:16px 18px!important}
html body.collection-page .collection-page-main .collection-subline strong,
html body.collection-page .collection-header-support .cs-open{padding:8px 12px!important}
html body.collection-page .collection-intro .collection-cloud-nudge{font-size:12.5px!important}
html body.collection-page .collection-header-support .cs-open{text-transform:none!important;font-size:13px!important}
html body.collection-page .collection-page-main .collection-subline strong{font-size:12px!important}

/* ===== 5) Peyo sentado en la esquina del cuadro "Tu colección todavía está en ceros" ===== */
html body.collection-page #collection-empty{position:relative;padding-bottom:168px!important}
.peyo-sit{display:block;pointer-events:none;height:auto}
.peyo-sit--album{position:absolute;right:clamp(16px,3vw,44px);bottom:0;width:auto!important;height:150px!important}
@media(max-width:700px){html body.collection-page #collection-empty{padding-bottom:132px!important}.peyo-sit--album{right:18px;height:112px!important}}
