/* Hexagonal cells retain readable rectangular content and accessible DOM order. */
.counter{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;max-width:1100px;background:none;border:0;box-shadow:none;backdrop-filter:none;padding:0;margin-top:30px}
.unit{isolation:isolate;min-height:165px;padding:30px 8px;justify-content:center;gap:10px}
.unit::before{content:'';position:absolute;inset:0;z-index:-1;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(145deg,#ffd1e45c,#ffb7d51c 50%,#8a71ac77)}
.unit::after,.unit:not(:last-child)::after{content:'';position:absolute;inset:1px;top:1px;right:1px;z-index:-1;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:#21172aef;display:block}
.seconds::after{background:#41213bef!important}.number{font-size:clamp(48px,6.6vw,79px)}.unit-label{font-size:8px;letter-spacing:1.6px}
.audience{margin-top:35px;padding-top:27px;border-top:1px solid #ffffff1c}.audience-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.audience h3{margin:0;font-size:21px;letter-spacing:-.3px}.audience-total{font-family:Barlow,sans-serif;font-size:25px;color:#ffc3da;white-space:nowrap}.audience-intro,.audience-note{font-size:11px;line-height:1.8;color:#bda9c6}.audience-note{font-size:10px;margin:15px 0 0}.country-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;list-style:none;margin:19px 0 0;padding:0}.country-row{display:flex;gap:9px;align-items:center;background:#2a1e34;border:1px solid #ffffff12;border-radius:5px;padding:13px 14px;font-size:12px;min-width:0}.country-code{font-family:Barlow,sans-serif;color:#ffbeda;font-weight:800;font-size:15px;letter-spacing:1px}.country-name{flex:1;overflow-wrap:anywhere}.country-count{font-variant-numeric:tabular-nums;font-weight:700;color:#ffe5ef}.country-empty{font-size:12px;color:#c7b0cf;line-height:1.8}
@media(max-width:900px){.counter{gap:8px}.unit{min-height:135px;padding:25px 5px}.number{font-size:58px}.country-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.counter{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:23px}.unit{min-height:126px;padding:21px 4px;gap:8px}.number{font-size:55px}.unit-label{font-size:7px;letter-spacing:1.1px}.country-list{grid-template-columns:repeat(2,minmax(0,1fr))}.country-row{padding:11px 9px;font-size:11px}.audience h3{font-size:20px}.audience-total{font-size:21px}.scene{height:1100px}}
@media(max-width:360px){.unit{min-height:112px}.number{font-size:49px}.country-list{grid-template-columns:1fr}}
@media(orientation:landscape) and (max-height:550px){.wrap{width:min(1100px,calc(100% - 40px))}.creator-inner{min-height:36px;padding-block:5px;flex-direction:row}.creator-credit strong{font-size:17px}.header{height:62px}.hero{padding-top:20px}.game-mark{height:155px;margin:10px 0}.hero-subtitle{margin:8px 0 12px}.counter{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:18px}.unit{min-height:111px;padding:20px 3px}.number{font-size:48px}.unit-label{font-size:7px}.counter-meta{margin:12px 0 18px}.scene{height:850px}.release-badge{font-size:9px;padding:8px 15px}}
@media(orientation:landscape) and (max-height:550px) and (min-width:650px){
  .hero{display:grid;grid-template-columns:minmax(150px,180px) minmax(0,1fr);column-gap:20px;padding-top:12px}
  .hero>.eyebrow{grid-column:1/-1;grid-row:1;margin-bottom:7px}
  .hero>.game-mark{grid-column:1;grid-row:2/6;height:150px;margin:0}
  .hero>.hero-subtitle{grid-column:2;grid-row:2;font-size:12px;margin:0 0 7px}
  .hero>.release-badge{grid-column:2;grid-row:3;justify-self:center;font-size:8px;padding:6px 12px}
  .hero>.counter{grid-column:2;grid-row:4;width:100%;gap:6px;margin-top:10px}
  .hero .unit{min-height:95px;padding:15px 2px;gap:5px}.hero .number{font-size:42px}.hero .unit-label{font-size:6px;letter-spacing:.8px}
  .hero>.counter-meta{grid-column:2;grid-row:5;margin:8px 0 0;font-size:6px}
  .hero>.close-message{grid-column:1/-1;grid-row:6;margin-top:12px}.hero .close-message strong{font-size:30px}
  .hero>.actions,.hero>.time-note,.hero>.platforms,.hero>.scroll-cue,.hero>.reached{grid-column:1/-1}.hero>.actions{margin-top:15px}
  .hero>.release-panel{grid-column:2;grid-row:4/6;margin-top:10px;padding:12px}.hero .release-panel h2{font-size:30px}
}
