:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#131b33;color:#eef1f8;--muted:#a9b4c8}*{box-sizing:border-box}body{margin:0;padding:22px 28px 12px}header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:18px;border-bottom:1px solid #39425b}.brand{display:flex;align-items:center;gap:14px}.brand img{border-radius:12px}.brand h1{font-size:clamp(24px,2.7vw,42px);margin:0}.brand p{margin:6px 0 0;color:var(--muted);font-size:16px}.right{text-align:right}#clock{font-variant-numeric:tabular-nums;font-weight:700;font-size:clamp(26px,3vw,44px)}.actions{display:flex;gap:8px;margin-top:8px}button{font:inherit;font-size:14px;border:1px solid #49546b;background:#202b44;color:#eef1f8;padding:8px 12px;border-radius:8px;cursor:pointer}button:hover{background:#34415a}button:focus-visible,a:focus-visible{outline:3px solid #7ce3a4;outline-offset:3px}.status{display:flex;justify-content:space-between;color:var(--muted);font-size:14px;padding:12px 0}.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.card{background:#1a2442;border:1px solid #35415c;border-radius:14px;padding:10px 16px 5px;overflow:hidden}.logo{display:flex;justify-content:center;margin:0 auto 6px;background:#fff;border-radius:9px;width:min(200px,70%);height:64px;padding:4px}.logo canvas{display:block;max-width:100%;height:100%;object-fit:contain}.draw{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid #33405b}.label{min-width:85px}.label strong{display:block;font-size:16px}.metadata{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;color:var(--muted);font-size:14px}.today .date{color:#77dca0}.older .date{color:#b0b8c4}.numbers{display:flex;gap:5px;flex-shrink:0}.ball{display:flex;align-items:center;justify-content:center;width:clamp(44px,4.5vw,72px);aspect-ratio:1;border-radius:50%;font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:clamp(30px,3.6vw,53px);font-weight:900;color:#142467;border:1px solid #939a9f;background:radial-gradient(circle at 38% 22%,#f5f5f5 0,#e9eaec 38%,#bec1c5 72%,#777e86 100%);box-shadow:inset 0 1px 3px #ffffff80,0 2px 3px #0002;line-height:1}.today .ball{border-color:#719881;background:radial-gradient(circle at 38% 22%,#f4fff7 0,#e3f5e9 38%,#b7dcc4 72%,#5d8f70 100%)}.pending .ball{background:#27344c;border:1px dashed #63718a;color:#9caabe;font-family:Arial;font-size:20px;box-shadow:none}.secondary{margin-top:20px}.secondary h2{font-size:14px;font-weight:600;color:var(--muted);margin:0 0 9px;text-transform:uppercase;letter-spacing:1.5px}.ticker-window{overflow:hidden;border:1px solid #35415c;border-radius:12px;background:#1a2442}.ticker{display:flex;width:max-content;animation:scroll 110s linear infinite;gap:26px;padding:10px 20px}.ticker-window:hover .ticker,.ticker-window:focus .ticker{animation-play-state:paused}.tick-group{display:flex;align-items:center;gap:22px}.tick-group .logo{width:100px;height:56px;margin:0;flex-shrink:0}.tick-group .draw{border:0;gap:12px;padding:0}.tick-group .ball{width:46px;font-size:33px}.tick-group .label{min-width:78px}.tick-group .label strong{font-size:14px}footer{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#a1adc0;padding-top:12px}a{color:inherit}@keyframes scroll{to{transform:translateX(-50%)}}@media(min-width:1700px){.board{gap:18px}.logo{height:82px}.draw{padding:15px 0}.label strong{font-size:20px}.metadata{font-size:16px}}@media(max-width:1050px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}.ball{width:58px;font-size:42px}}@media(max-width:660px){body{padding:14px 12px}.board{grid-template-columns:1fr;gap:12px}header{align-items:flex-start}.brand img{display:none}.brand h1{font-size:24px}.brand p{font-size:14px}.actions{flex-wrap:wrap;justify-content:flex-end;max-width:160px}.actions button{font-size:12px;padding:7px}.status>span:last-child{display:none}.ball{width:62px;font-size:46px}.right #clock{font-size:24px}.logo{height:70px}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){.ticker{animation:none;width:auto;flex-wrap:wrap}.tick-group{flex-wrap:wrap}.ticker-window{overflow:auto}}

#fullscreen-hint{display:block;width:100%;margin:14px 0 0;padding:12px;background:#24543d;border-color:#5b9e76;font-size:16px}#fullscreen-hint[hidden]{display:none}html:fullscreen{overflow:auto}html:fullscreen body{min-height:100vh}

.board .draw{flex-direction:column;justify-content:center;gap:9px;padding:12px 0}.board .label{text-align:center;width:100%}.board .metadata{justify-content:center;margin-top:4px}.board .numbers{justify-content:center;width:100%;gap:8px}.board .ball{width:clamp(68px,6.6vw,100px);font-size:clamp(48px,5.1vw,74px)}.board .card{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}.board .logo{grid-column:1/-1}.board .draw:only-of-type{grid-column:1/-1}.board .card:has(.draw:nth-child(2):last-child) .draw{grid-column:1/-1}.board .card:has(.draw:nth-child(3)) .ball{width:clamp(40px,3.4vw,60px);font-size:clamp(29px,2.7vw,45px)}@media(max-width:660px){.board .ball{width:80px;font-size:58px}.board .card:has(.draw:nth-child(3)) .ball{width:44px;font-size:32px}}.tick-group .draw{flex-direction:column;gap:6px}.tick-group .label{text-align:center}.tick-group .metadata{justify-content:center}.tick-group .ball{width:58px;font-size:42px}
.board .card{display:block}.board .card:has(.draw:nth-child(3)) .ball{width:clamp(68px,6.6vw,100px);font-size:clamp(48px,5.1vw,74px)}@media(max-width:660px){.board .card:has(.draw:nth-child(3)) .ball{width:80px;font-size:58px}}

/* Las bolitas crecen con el ancho disponible de cada tarjeta. */
.board{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}.board .card{container-type:inline-size}.board .numbers{gap:2cqw}.board .ball,.board .card:has(.draw:nth-child(3)) .ball{width:29cqw;font-size:21cqw;flex:0 0 auto}.board .label strong{font-size:clamp(16px,4.8cqw,30px)}.board .metadata{font-size:clamp(13px,3.8cqw,24px)}.board .logo{width:65%;height:clamp(64px,18cqw,150px)}.board .draw{gap:2cqw;padding:3cqw 0}.tick-group .ball{width:clamp(48px,5vw,100px);font-size:clamp(35px,3.6vw,72px)}
@media(max-width:1100px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.board{grid-template-columns:1fr}header{flex-direction:column;align-items:center;gap:12px}.brand{text-align:center}.right{text-align:center;width:100%}.actions{max-width:none;justify-content:center}.status{justify-content:center}.brand h1{overflow-wrap:anywhere}}
@media(min-width:1900px){body{padding:1.5vw 2vw}.board{gap:1.2vw}.card{padding:1vw}.brand h1{font-size:2.7vw}.right #clock{font-size:3vw}}

/* Pantallas horizontales: nueve tarjetas y cinta dentro de la pantalla. */
@media(min-width:900px) and (min-aspect-ratio:4/3){
html,body{height:100%;overflow:hidden}body{height:100dvh;padding:1vh 1.4vw;display:flex;flex-direction:column;gap:.6vh}header{padding-bottom:.7vh;flex-shrink:0}.brand img{width:5vh;height:5vh}.brand h1{font-size:3.8vh}.brand p{font-size:1.7vh;margin-top:.4vh}.right #clock{font-size:4vh}.actions{margin-top:.4vh}button{padding:.5vh .8vw;font-size:1.5vh}main{flex:1;min-height:0;display:flex;flex-direction:column}#fullscreen-hint{margin:.3vh 0;padding:.6vh;font-size:1.7vh;flex-shrink:0}.status{padding:.6vh 0;font-size:1.5vh;flex-shrink:0}.board{flex:1;min-height:0;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:.8vh;align-items:stretch}.board .card{display:flex;flex-direction:column;padding:.5vh .8vw;min-height:0}.board .logo{height:4.8vh;min-height:4.8vh;margin-bottom:.3vh;width:55%;padding:.2vh}.board .draw{flex:1;min-height:0;padding:.35vh 0;gap:.3vh}.board .label strong{font-size:1.7vh}.board .metadata{font-size:1.5vh;margin-top:.15vh}.board .numbers{flex:1;min-height:0;align-items:center}.board .ball,.board .card:has(.draw:nth-child(3)) .ball{width:min(29cqw,var(--draw-ball,6vh));font-size:min(21cqw,calc(var(--draw-ball,6vh)*.72))}.secondary{margin-top:.6vh;flex-shrink:0}.secondary h2{font-size:1.3vh;margin-bottom:.3vh}.ticker{padding:.5vh 1vw}.tick-group .logo{height:4vh;width:8vw}.tick-group .label strong{font-size:1.5vh}.tick-group .metadata{font-size:1.3vh}.tick-group .draw{gap:.3vh}.tick-group .ball{width:5vh;font-size:3.6vh}footer{padding-top:0;font-size:1.2vh;flex-shrink:0}
}
@media(min-width:900px) and (min-aspect-ratio:4/3){.board .card:has(.draw:nth-child(3)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:4.8vh minmax(0,1fr);column-gap:.4vw}.board .card:has(.draw:nth-child(3)) .logo{grid-column:1/-1}.board .card:has(.draw:nth-child(3)) .draw{grid-column:auto}.board .numbers{gap:.4vw}}

/* Separación visible entre los sorteos de una misma lotería. */
.board .draw + .draw{border-top:2px solid #7e91b4;padding-top:14px}
@media(min-width:900px) and (min-aspect-ratio:4/3){.board .card:has(.draw:nth-child(3)){column-gap:1.2vw}.board .card:has(.draw:nth-child(3)) .draw + .draw{border-top:1px solid #33405b;border-left:2px solid #8c9cbd;padding-top:.35vh;padding-left:.7vw}}


/* Logo al máximo del recuadro blanco, sin salir de sus límites. */
.board .logo,.tick-group .logo{padding:0;overflow:hidden}.logo canvas{width:auto;max-width:100%;height:100%;object-fit:contain}

.board .logo-pair{width:100%;background:transparent;gap:1.2vw;overflow:visible}.logo-slot{width:50%;height:100%;display:flex;justify-content:center;background:white;border-radius:7px;overflow:hidden}.logo-slot img,.logo-slot canvas{height:100%;max-width:100%;width:auto;object-fit:contain}
.anguila-heading{margin-top:8px!important}@media(min-width:900px) and (min-aspect-ratio:4/3){.anguila-heading{margin-top:.3vh!important}.tick-group .ball{width:3.8vh;font-size:2.74vh}.ticker{padding:.2vh 1vw}.tick-group .logo{height:3.5vh}.tick-group .label strong{font-size:1.3vh}.tick-group .metadata{font-size:1.2vh}.tick-group .label{min-width:0}.tick-group{gap:1.2vw}}
#haiti-ticker{animation:none;width:100%}#haiti-ticker .tick-group{width:100%;justify-content:space-between;gap:8px}#haiti-ticker .draw{flex:1;min-width:0}#haiti-ticker .numbers{gap:2px}#haiti-ticker .logo{width:8%;min-width:45px}#haiti-ticker .ball{width:clamp(16px,2.9vw,60px);font-size:clamp(12px,2.1vw,43px)}@media(max-width:620px){#haiti-ticker .tick-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}#haiti-ticker .logo{grid-column:1/-1;width:100px;margin:auto}#haiti-ticker .ball{width:clamp(22px,7vw,40px);font-size:clamp(16px,5vw,29px)}}
.secondary .ticker-window{display:flex;align-items:center}.secondary .pinned-logo{flex:0 0 8%;width:8%;height:50px;margin:0 8px;background:white;z-index:2}.secondary #haiti-ticker{flex:1;min-width:0;width:auto}.secondary #ticker{flex:none}@media(min-width:900px) and (min-aspect-ratio:4/3){.secondary .pinned-logo{height:3.8vh}}@media(max-width:620px){.secondary .pinned-logo{height:44px;flex-basis:64px;width:64px}}