/* ring-v3 — load AFTER v24.css / v25.css. Bigger circles, thin ring, tight columns.
   Home row:  circle 76 -> 88px, ring 5 -> 2.5px, white gap 3 -> 2px, photo 60 -> 79px (90%), gap between rings 12 -> 8px
   Sheet:     circle 58 -> 82px, ring 4 -> 2.5px, white gap 2.5 -> 2px, photo 45 -> 73px (89%), column gap 8 -> 6px, row gap 12 -> 10px, side padding 16 -> 12px */
.h24rings{gap:8px}
.h24ring{width:90px;gap:6px}
.h24rw{width:88px;height:88px;box-shadow:0 4px 12px rgba(16,185,129,.22)}
.h24ph{width:83px;height:83px;border-width:2px}
.h24lb{max-width:90px}
.h24rw.sm{width:70px;height:70px}
.h24rw.sm .h24ph{width:65px;height:65px;border-width:2px}
.h24sheet{padding-left:12px;padding-right:12px}
.h24allg{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 6px}
.h24ac{gap:5px;font-size:11.5px}
.h24rw.xs{width:82px;height:82px;box-shadow:0 4px 10px rgba(16,185,129,.2)}
.h24rw.xs .h24ph{width:77px;height:77px;border-width:2px}
/* live guard: 4 x 82px + gaps needs 370px; on <375px viewports scale the sheet circles so nothing overflows */
@media (max-width:374px){.h24ac{font-size:10.5px;overflow-wrap:anywhere;min-width:0}.h24rw.xs{width:74px;height:74px}.h24rw.xs .h24ph{width:69px;height:69px}.h24sheet{padding-left:10px;padding-right:10px}}