/* PitiPeibol: community archive, agenda and the lower homepage. */
.pp-home .pp-lower{--lower-line:#29475f;--lower-muted:#b2c4d7;position:relative;padding:72px 0!important;border-top:1px solid #223a50;background:radial-gradient(ellipse at 90% 0,#18446c16,transparent 55%),#070d16}
.pp-home .pp-lower:nth-of-type(even){background-color:#0a121e}
.pp-home .pp-lower>.wrap{max-width:1480px;width:100%;box-sizing:border-box;padding-inline:clamp(20px,4vw,64px)}
.pp-home .pp-lower>.wrap>.eyebrow,.pp-home .pp-lower .reels-heading .eyebrow{color:#74c4ff;font:700 clamp(20px,1.35vw,24px)/1.4 var(--display);letter-spacing:.09em;margin:0 0 18px;display:flex;align-items:center;gap:12px}
.pp-home .pp-lower .eyebrow::before{content:'';width:44px;height:4px;background:linear-gradient(90deg,#54baff,#ee4560);flex:none}
.pp-home .pp-lower h2{font:700 clamp(48px,4vw,72px)/1.12 var(--display);letter-spacing:-.025em;text-transform:uppercase;color:#f1f6ff;margin:0 0 18px;text-wrap:balance}
.pp-home .pp-lower .section-sub{font:400 clamp(20px,1.5vw,24px)/1.65 var(--body);max-width:72ch;color:var(--lower-muted);margin:0 0 32px}
.pp-home .pp-lower :where(button,a,input,select):focus-visible{outline:3px solid #83d3ff;outline-offset:4px}
.pp-home .pp-lower :where(.btn,.reels-channel,.reels-more,.sp-btn,.sorteo-tab,.htab,.clip-tab){min-height:56px;box-sizing:border-box;font-size:20px;border-radius:9px;clip-path:none;justify-content:center}
.pp-home .pp-lower .btn{padding:13px 22px;line-height:1.4;white-space:normal;text-align:center}
.pp-home .pp-lower .btn-primary{background:linear-gradient(135deg,#2078bc,#245b99);color:white;border:1px solid #69b9f6;box-shadow:0 4px 18px #1478b922}
.pp-home .pp-lower :where(.panel,.vt-caja,.gan-mes,.dimension-temas,.leaderboard,.no-giveaway){background:linear-gradient(135deg,#102033,#0b1421);border:1px solid var(--lower-line);border-radius:16px;padding:28px;box-shadow:0 12px 32px #0002}
.pp-home .pp-lower :where(.panel,.vt-caja) p{line-height:1.7;font-size:20px}
.pp-home .pp-lower .panel h3{font-size:30px!important;line-height:1.3}
/* Three podiums, with a clear first place and room for names and scores. */
.pp-home #leyendas .ley-grupo{font:600 18px/1.6 var(--display);letter-spacing:.07em;color:#a5bed6;padding:0 0 16px;border:0;margin:0}
.pp-home #leyendas .leyendas-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.pp-home #leyendas .ley-card{padding:26px 22px 22px;border:1px solid #33526e;background:linear-gradient(145deg,#142438,#0a1320);border-radius:16px;box-shadow:0 14px 28px #0003;min-width:0}
.pp-home #leyendas .ley-card::before{inset:0 20px auto;height:2px;background:linear-gradient(90deg,#58baff,#f15064);z-index:0;border-radius:0}
.pp-home #leyendas .ley-head{align-items:flex-start;gap:14px;margin-bottom:24px;min-height:72px}
.pp-home #leyendas .ley-icon{width:46px;height:46px;border:1px solid #416c91;background:#1c42634a;border-radius:12px}
.pp-home #leyendas .ley-title{font:700 26px/1.3 var(--display)}
.pp-home #leyendas .ley-title small{font:400 18px/1.55 var(--body);color:#aac0d7;letter-spacing:0;text-transform:none;margin-top:8px}
.pp-home #leyendas .ley-fila{display:grid;grid-template-columns:32px minmax(0,1fr);gap:9px;padding:14px 10px;border:1px solid #293f57;border-radius:10px;margin-top:10px;background:#0a1421}
.pp-home #leyendas .ley-fila.oro{padding-block:20px;background:linear-gradient(110deg,#60471b66,#211d1633);border-color:#ab873b}
.pp-home #leyendas .ley-quien{font:600 22px/1.4 var(--body);min-width:0;overflow-wrap:anywhere;white-space:normal}
.pp-home #leyendas .oro .ley-quien{font-size:24px;color:#ffe1a1}
.pp-home #leyendas .ley-valor{font:600 18px/1.5 var(--mono);padding:5px 10px;white-space:normal;text-align:left;max-width:none;grid-column:2;justify-self:start}
/* Agenda: the game, date and local time are the primary information. */
.pp-home #horario .hor-tabs{gap:10px;margin:0 0 24px}
.pp-home #horario .htab{font:600 19px/1.4 var(--body);padding:14px 20px;letter-spacing:0;background:#101d2c;border-color:#304b65;color:#bbccdd}
.pp-home #horario .htab.active{background:#17416a;border-color:#6dc4ff;color:#fff;box-shadow:inset 0 -2px #65c3ff}
.pp-home #horario .hor-card{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 170px;gap:32px;padding:32px;margin-bottom:16px;border-radius:15px;background:#101c2c;border-color:#304d69;border-left:3px solid #4fa7e8;min-height:208px;box-sizing:border-box;isolation:isolate}
.pp-home #horario .hor-card.proximo,.pp-home #horario .hor-card.vivo{border-left-color:#f55a70}
.pp-home #horario .hor-fondo{z-index:-1;opacity:.2}
.pp-home #horario .hor-art{width:96px;height:128px;border-radius:8px}
.pp-home #horario .hor-izq{gap:18px;min-width:0}
.pp-home #horario .hor-juego{font-size:clamp(30px,2.1vw,40px)!important;line-height:1.2;white-space:normal;overflow-wrap:anywhere}
.pp-home #horario .hor-dia{font-size:22px;line-height:1.5;margin-top:12px}
.pp-home #horario :where(.badge-prox,.badge-live){font-size:14px;letter-spacing:.05em;margin:6px 0 0;padding:5px 10px;display:inline-flex}
.pp-home #horario .hor-centro{gap:14px;padding-left:28px;line-height:1.6;order:initial;border-top:0;flex-direction:column;align-items:flex-start}
.pp-home #horario .hor-dur{font:600 24px/1.5 var(--body);white-space:normal}
.pp-home #horario .hor-dur small{display:block;font-size:20px;font-weight:400;margin-top:4px}
.pp-home #horario .hor-falta{font:600 20px/1.5 var(--body);white-space:normal;letter-spacing:0;text-transform:none}
.pp-home #horario .hor-cal{min-height:56px;font-size:20px;padding:14px 18px;border-radius:8px;white-space:normal}
.pp-home #horario .hor-hora .hh{font-size:52px;letter-spacing:-.04em}
.pp-home #horario .hor-hora .hl{font:500 20px/1.5 var(--body);margin-top:8px}
/* Full vertical artwork, readable captions, larger video previews. */
.pp-home #pildoras .reels-heading{margin-bottom:30px;align-items:end}
.pp-home #pildoras .reels-heading .section-sub{margin:0}
.pp-home #pildoras .reels-grid{max-width:none;gap:24px;grid-template-columns:repeat(4,minmax(0,1fr))}
.pp-home #pildoras .reel-card{border-color:#365773;border-radius:14px;box-shadow:0 12px 24px #0003}
.pp-home #pildoras .reel-info{padding:20px;gap:14px}
.pp-home #pildoras .reel-info h3{font-size:22px;line-height:1.5}
.pp-home #pildoras .reel-info time{font-size:17px}
.pp-home #pildoras .reel-watch{font-size:18px;min-height:46px}
.pp-home :where(#clips,#vods) .clips-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.pp-home :where(#clips,#vods) .clip-card{border-radius:14px;border-color:#33536e;background:#101e30;box-shadow:0 10px 24px #0003}
.pp-home :where(#clips,#vods) .clip-card .info{padding:20px}
.pp-home :where(#clips,#vods) .clip-card .t{font-size:24px;line-height:1.5;-webkit-line-clamp:3}
.pp-home :where(#clips,#vods) .clip-card .m{font:400 18px/1.7 var(--body);color:#aec2d8;margin-top:12px}
.pp-home #clips .clip-tabs{gap:10px;margin-bottom:26px}
.pp-home #clips .clip-tab{font:600 20px/1.4 var(--body);letter-spacing:0;text-transform:none;padding:14px 22px;background:#101f30;border-color:#35516e}
.pp-home #clips .clip-tab.active{background:#17446d;color:white;border-color:#69befe}
.pp-home #clips .clip-tab.rango.active{background:#552331;border-color:#ee6981}
/* The albums and voting share the same visual language as the player. */
.pp-home #disco .dimensiones{gap:28px;max-width:1080px;margin-inline:auto}
.pp-home #disco .dimension-card{display:grid;grid-template-columns:minmax(0,1fr);border-radius:18px;border-color:#3c536c;background:#0d1929}
.pp-home #disco .dimension-info{padding:26px}
.pp-home #disco .dimension-info h3{font-size:40px}.pp-home #disco .dimension-info .disco-mes{font-size:18px}
.pp-home #disco .dimension-select{min-height:58px;font-size:20px}
.pp-home #disco .dimension-cabecera h3{font-size:30px}.pp-home #disco .dimension-cabecera p{font-size:20px;line-height:1.6}
.pp-home #disco .dimension-lista button{min-height:60px;font-size:20px;line-height:1.5;padding:13px 12px}
.pp-home #disco .dimension-lista .num{font-size:16px}
.pp-home #disco .dimension-descarga{padding-top:32px;font-size:22px;line-height:1.7}
.pp-home #disco .disco-nota{font-size:18px;color:#b2c4d7}
.pp-home #votacion .vt-selects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pp-home #votacion .vt-selects label{min-width:0;font-size:22px;gap:12px}
.pp-home #votacion .vt-selects select{width:100%;min-width:0;min-height:58px;font-size:19px;color:#ecf3ff;padding:12px;background:#0a1524;border-color:#47627d}
.pp-home #votacion .vt-resultados{margin-top:30px}.pp-home #votacion .vt-resultados-titulo{font-size:20px;line-height:1.6;margin-bottom:24px}
.pp-home #votacion .vt-fila{display:grid;grid-template-columns:28px minmax(150px,250px) minmax(30px,1fr) 70px;gap:16px;padding:13px 0;margin:0;border-bottom:1px solid #22384e}
.pp-home #votacion .vt-fila :where(.vt-nombre,.vt-puntos){width:auto;font-size:19px}.pp-home #votacion .vt-nombre{white-space:normal;overflow-wrap:anywhere}
.pp-home #votacion .vt-barra-fondo{height:12px}
.pp-home #ganadoras .gan-lista{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.pp-home #ganadoras .gan-mes-titulo{font-size:26px;line-height:1.5;padding-bottom:16px;border-bottom:1px solid #31506b}
.pp-home #ganadoras .gan-fila{padding:14px 0;gap:10px;align-items:flex-start}.pp-home #ganadoras .gan-titulo{font-size:20px;line-height:1.5;min-width:0;overflow-wrap:anywhere}
.pp-home #ganadoras .gan-puntos{font-size:17px;line-height:1.8}
/* Rewards, raffles and closing information. */
.pp-home #sorteos .giveaway-card{padding:32px;gap:32px;background:linear-gradient(130deg,#182639,#101721);border-color:#53617b;border-radius:16px}
.pp-home #sorteos .giveaway-card h3{font-size:28px;line-height:1.3}
.pp-home #sorteos .panel>div{min-width:0!important}
.pp-home #sorteos .ganadores-grid{gap:22px}.pp-home #sorteos .gan-card{padding:30px 20px;border-radius:14px;background:#101d2e}
.pp-home #sorteos .gan-nombre{font-size:26px}.pp-home #sorteos .gan-premio{font-size:20px;line-height:1.6}
.pp-home #musica-bits input{min-height:52px;font-size:17px!important}
.pp-home #pitipoints .sp-aviso{padding:32px;border-radius:16px}.pp-home #pitipoints .sp-aviso h3{font-size:32px}
.pp-home #pitipoints .coins-grid{gap:30px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.pp-home #pitipoints .coins-grid>div{min-width:0}
.pp-home #pitipoints .coins-h{font:600 24px/1.4 var(--body);margin-bottom:22px}
.pp-home #pitipoints .coins-list{display:grid;gap:0}.pp-home #pitipoints .coins-list li{font-size:20px;line-height:1.7;padding:14px 0;gap:16px;border-bottom:1px solid #24384c}
.pp-home #pitipoints .coin-val{font-size:22px;min-width:48px}
.pp-home #pitipoints .leaderboard{padding:24px}.pp-home #pitipoints .leaderboard li{padding:18px 10px;gap:14px;font-size:21px}.pp-home #pitipoints .leaderboard .pts{font-size:18px}
.pp-home #pitipoints .stream-note{font-size:18px;line-height:1.75}
.pp-home #pp-pie footer{position:relative;background:linear-gradient(135deg,#101e30,#070c14);border-top:1px solid #3b5b78;padding-top:48px;font-size:20px;line-height:1.7}
.pp-home #pp-pie footer::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#3baeff,transparent 45%,#e74860)}
.pp-home #pp-pie .foot-in{gap:22px;align-items:center}.pp-home #pp-pie .mono{font-size:17px;line-height:1.8}
@media(max-width:1100px){
 .pp-home #leyendas .leyendas-grid{grid-template-columns:1fr}.pp-home #leyendas .ley-head{min-height:0;margin-bottom:16px}.pp-home #leyendas .ley-card{padding:24px}.pp-home #leyendas .ley-valor{max-width:none}
 .pp-home #horario .hor-card{grid-template-columns:minmax(0,1fr) 160px}.pp-home #horario .hor-centro{grid-column:1/-1;grid-row:2;border-left:0;border-top:1px solid #314b64;padding:18px 0 0;flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px 24px}
 .pp-home #pildoras .reels-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.pp-home #pildoras .reels-heading{align-items:flex-start}
 .pp-home #ganadoras .gan-lista{grid-template-columns:1fr}
}
@media(max-width:760px){
 .pp-home .pp-lower{padding:46px 0!important}.pp-home .pp-lower>.wrap{padding-inline:20px}.pp-home .pp-lower h2{font-size:40px}.pp-home .pp-lower .section-sub{font-size:18px;line-height:1.7;margin-bottom:26px}
 .pp-home .pp-lower :where(.panel,.vt-caja,.gan-mes,.dimension-temas){padding:20px}
 .pp-home #pildoras .reels-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pp-home #pildoras .reel-info{padding:16px}.pp-home #pildoras .reel-info h3{font-size:20px}
 .pp-home :where(#clips,#vods) .clips-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.pp-home :where(#clips,#vods) .clip-card .info{padding:16px}
 .pp-home #disco .dimensiones{gap:18px}.pp-home #disco .dimension-info{padding:20px}
 .pp-home #votacion .vt-selects{grid-template-columns:1fr}.pp-home #votacion .vt-fila{grid-template-columns:24px minmax(0,1fr) 54px;gap:8px 12px}.pp-home #votacion .vt-barra-fondo{grid-row:2;grid-column:2/-1}.pp-home #votacion .vt-fila .vt-puntos{grid-column:3;grid-row:1;font-size:16px}
 .pp-home #pitipoints .coins-grid{grid-template-columns:1fr}.pp-home #sorteos .giveaway-card{padding:24px}.pp-home #pp-pie .foot-in{flex-direction:column;align-items:flex-start}
}
@media(max-width:500px){
 .pp-home .pp-lower h2{font-size:34px}.pp-home .pp-lower>.wrap{padding-inline:18px}
 .pp-home #leyendas .ley-card{padding:22px 16px}.pp-home #leyendas .ley-title{font-size:22px}.pp-home #leyendas .ley-head{gap:10px}.pp-home #leyendas .ley-fila{grid-template-columns:24px minmax(0,1fr);padding:14px 10px}.pp-home #leyendas .ley-valor{grid-column:2;justify-self:start;text-align:left}.pp-home #leyendas .oro .ley-quien{font-size:20px}
 .pp-home #horario .hor-card{padding:18px 14px;grid-template-columns:minmax(0,1fr);gap:18px}.pp-home #horario .hor-art{width:54px;height:72px}.pp-home #horario .hor-izq{gap:12px}.pp-home #horario .hor-hora{grid-row:2;text-align:left;display:flex;align-items:center;gap:14px}.pp-home #horario .hor-hora .hl{margin:0}.pp-home #horario .hor-centro{grid-row:3}.pp-home #horario .htab{padding:12px 14px;font-size:17px}
 .pp-home #pildoras .reels-grid{grid-template-columns:1fr;max-width:360px;margin-inline:auto}.pp-home #pildoras .reel-info h3{font-size:22px}.pp-home #pildoras .reels-channel{width:100%}
 .pp-home :where(#clips,#vods) .clips-grid{grid-template-columns:1fr}.pp-home #disco .dimensiones{grid-template-columns:1fr}
 .pp-home #pitipoints .leaderboard{padding:16px}.pp-home #pitipoints .leaderboard li{font-size:18px;gap:8px}.pp-home #pitipoints .leaderboard .pts{font-size:16px}
 .pp-home #sorteos .countdown{gap:8px;flex-wrap:wrap}.pp-home #sorteos .count-unit{min-width:52px;padding:12px 8px}
}
@media(prefers-reduced-motion:reduce){.pp-home .pp-lower *{transition:none!important;scroll-behavior:auto!important}}

/* Legibility: a wide display face, clear indentation and comfortable metadata. */
.pp-home .pp-lower h2{max-width:26ch;padding-left:22px;border-left:5px solid #55b6f7;text-shadow:0 3px 16px #0005}
.pp-home .pp-lower h2::after{display:none}
.pp-home #horario .hor-meta{font:400 18px/1.5 var(--body);margin-top:10px}
.pp-home #horario .hor-centro{border-left-color:#446887}
.pp-home #horario .hor-cal{background:#163451;border-color:#568ab3;color:#f0f7ff}
.pp-home #horario .hor-dur small,.pp-home #horario .hor-hora .hl{color:#c3d3e4}
.pp-home #pildoras .reels-heading{gap:32px;flex-wrap:wrap}.pp-home #pildoras .reels-heading>div{flex:1 1 600px}
.pp-home #pildoras :where(.reels-channel,.reels-more){font-size:20px;min-height:56px}
.pp-home #pildoras .reels-status{font-size:18px}
@media(max-width:1100px){.pp-home #horario .hor-centro{border-left:0}}
@media(max-width:760px){
 .pp-home .pp-lower>.wrap>.eyebrow,.pp-home .pp-lower .reels-heading .eyebrow{font-size:18px;letter-spacing:.06em;gap:10px}
 .pp-home .pp-lower .eyebrow::before{width:28px}
 .pp-home .pp-lower h2{padding-left:14px;border-left-width:4px;overflow-wrap:anywhere}
 .pp-home .pp-lower :where(.btn,.reels-channel,.reels-more,.sp-btn,.sorteo-tab,.htab,.clip-tab){font-size:18px;min-height:50px}
 .pp-home #horario .hor-card{padding:22px;gap:22px}
 .pp-home #horario .hor-juego{font-size:28px!important}.pp-home #horario .hor-dia{font-size:19px}
 .pp-home #horario .hor-dur{font-size:21px}.pp-home #horario .hor-dur small{font-size:18px}
 .pp-home #horario .hor-falta,.pp-home #horario .hor-cal,.pp-home #horario .hor-hora .hl{font-size:18px}
 .pp-home #horario .hor-meta{font-size:16px}.pp-home #horario .hor-hora .hh{font-size:42px}
 .pp-home #clips .clip-tab{font-size:18px;padding:12px 18px}
 .pp-home #disco .dimension-lista button{font-size:18px}.pp-home #disco .dimension-info h3{font-size:32px}
 .pp-home #votacion .vt-fila .vt-nombre{font-size:18px}
 .pp-home #leyendas .ley-quien{font-size:20px}.pp-home #leyendas .ley-title small{font-size:17px}
 .pp-home #pitipoints .coins-list li{font-size:18px}
}
@media(max-width:500px){
 .pp-home #horario .hor-card{padding:20px 16px}.pp-home #horario .hor-juego{font-size:25px!important}
 .pp-home #horario .hor-centro{flex-direction:column;align-items:stretch;gap:16px}.pp-home #horario .hor-cal{justify-content:center}
 .pp-home #horario .hor-hora{gap:16px;flex-wrap:wrap}
 .pp-home #leyendas .ley-grupo{font-size:16px}
 .pp-home #ganadoras .gan-fila{flex-wrap:wrap}.pp-home #ganadoras .gan-titulo{flex-basis:60%}
}
