/* gm1 (Mortimer, 05-11-2026, piece 3 of the engagement plan): the daily GM card (templates/components/_gm.html, gm.js).
   A sunrise: the big round «GM ☀️» on the left, the streak in the middle, «Today's GMs» on the right. Every size here is
   0.75rem or more (smalltext1); emojis are upright and centred (never italic, never stretched). */
section.block.gm-block { padding-top: 28px; }
section.block.gm-block.first { padding-top: 40px; }
.gm { --sun: #fbbf24; --sun2: #f97316; --dawn: #f472b6;
    position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.1fr);
    align-items: center; gap: 22px 28px; padding: 22px 26px; border-radius: 24px;
    background: radial-gradient(420px 260px at 6% 50%, rgba(251,191,36,0.20), transparent 70%),
        radial-gradient(520px 260px at 100% 0%, rgba(244,114,182,0.10), transparent 70%),
        linear-gradient(160deg, #1d0d2e, #0b0520 70%);
    border: 1px solid rgba(251,191,36,0.20); box-shadow: 0 20px 54px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.06); }
.gm-sky { position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(180deg, transparent 55%, rgba(249,115,22,0.07)); }
.gm-sky::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(251,191,36,0.55), rgba(244,114,182,0.4), transparent); }

/* the button: a sun you press */
.gm-say { position: relative; display: grid; place-items: center; padding: 20px 14px; }
.gm-btn { position: relative; display: grid; place-items: center; align-content: center; gap: 2px; width: 156px; height: 156px; padding: 0;
    border-radius: 50%; border: 0; cursor: pointer; color: #1a0b02; font: inherit;
    background: radial-gradient(circle at 50% 32%, #fff3c4, var(--sun, #fbbf24) 46%, var(--sun2) 100%);
    box-shadow: 0 0 0 6px rgba(251,191,36,0.14), 0 0 44px rgba(251,191,36,0.45), 0 18px 34px -10px rgba(249,115,22,0.7), inset 0 -8px 18px rgba(194,65,12,0.35), inset 0 6px 14px rgba(255,255,255,0.55);
    transition: transform 0.3s cubic-bezier(.2,.9,.3,1.4), box-shadow 0.3s; }
.gm-rays { position: absolute; inset: -22px; z-index: -1; border-radius: 50%; pointer-events: none; opacity: 0.85;
    background: repeating-conic-gradient(from 0deg, rgba(251,191,36,0.42) 0deg 5deg, transparent 5deg 22.5deg);
    -webkit-mask: radial-gradient(circle, transparent 54%, #000 56%, #000 64%, transparent 72%); mask: radial-gradient(circle, transparent 54%, #000 56%, #000 64%, transparent 72%);
    animation: gm-spin 26s linear infinite; }
@keyframes gm-spin { to { transform: rotate(360deg); } }
.gm-sun { display: block; font-size: 1.9rem; line-height: 1; font-style: normal; transform: translateY(2px); }
.gm-word { display: block; font-size: 2.3rem; font-weight: 900; letter-spacing: -0.02em; line-height: 1; }
.gm-sub { display: block; max-width: 120px; font-size: 0.75rem; font-weight: 800; line-height: 1.2; text-align: center; opacity: 0.82; }
.gm-btn:not(:disabled):hover, .gm-btn:not(:disabled):focus-visible { transform: scale(1.06) rotate(-2deg);
    box-shadow: 0 0 0 8px rgba(251,191,36,0.2), 0 0 70px rgba(251,191,36,0.6), 0 22px 40px -10px rgba(249,115,22,0.8), inset 0 -8px 18px rgba(194,65,12,0.35), inset 0 6px 14px rgba(255,255,255,0.6); }
.gm-btn:not(:disabled):hover .gm-rays { animation-duration: 6s; }
.gm-btn:not(:disabled):active { transform: scale(0.96); }
.gm-btn:focus-visible { outline: 3px solid #fff; outline-offset: 6px; }
.gm-btn:not(:disabled) .gm-sun { animation: gm-bob 2.6s ease-in-out infinite; }
@keyframes gm-bob { 50% { transform: translateY(-2px) rotate(-6deg); } }
.gm-btn.is-busy { cursor: progress; }
/* said: a calm sun, no pulse */
.gm.is-done .gm-btn { cursor: default; color: #fff;
    background: radial-gradient(circle at 50% 32%, rgba(251,191,36,0.55), rgba(249,115,22,0.32) 60%, rgba(244,114,182,0.22));
    box-shadow: 0 0 0 6px rgba(251,191,36,0.10), 0 0 34px rgba(251,191,36,0.25), inset 0 1px 0 rgba(255,255,255,0.25); }
.gm.is-done .gm-rays { opacity: 0.4; }
.gm.is-done .gm-word { font-size: 1.5rem; }
.gm.is-done .gm-sub { opacity: 1; color: #4ade80; text-shadow: 0 1px 6px rgba(5,46,22,0.55); }   /* gm4: «✓ See you tomorrow» in green: done at a glance */
.gm-btn:disabled { cursor: default; }
/* the moment it is said: a flash and rays that burst out */
.gm.is-burst .gm-btn { animation: gm-burst 0.9s cubic-bezier(.2,.9,.3,1.3); }
@keyframes gm-burst { 0% { transform: scale(0.92); } 35% { transform: scale(1.12); box-shadow: 0 0 0 26px rgba(251,191,36,0), 0 0 120px rgba(251,191,36,0.9); } 100% { transform: scale(1); } }
.gm.is-burst .gm-rays { animation: gm-spin 26s linear infinite, gm-flare 1s ease-out; }
@keyframes gm-flare { 0% { transform: scale(0.9); opacity: 1; } 40% { transform: scale(1.4) rotate(40deg); opacity: 1; } 100% { transform: scale(1); opacity: 0.4; } }
.gm-pop { position: absolute; left: 50%; top: 0; z-index: 2; pointer-events: none; white-space: nowrap; transform: translate(-50%, 0); opacity: 0;
    padding: 5px 12px; border-radius: 999px; font-size: 0.85rem; font-weight: 900; color: #1a0b02;
    background: linear-gradient(90deg, var(--sun, #fbbf24), var(--sun2)); box-shadow: 0 10px 24px -8px rgba(249,115,22,0.8); }
.gm-pop.is-on { animation: gm-pop 2.4s cubic-bezier(.2,.9,.3,1.2) forwards; }
@keyframes gm-pop { 0% { opacity: 0; transform: translate(-50%, 10px) scale(0.8); } 15% { opacity: 1; transform: translate(-50%, -22px) scale(1.05); } 80% { opacity: 1; transform: translate(-50%, -30px); } 100% { opacity: 0; transform: translate(-50%, -44px); } }

/* the middle: the streak */
.gm-info { min-width: 0; display: grid; gap: 10px; }
.gm-k { display: inline-flex; align-items: center; gap: 6px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sun, #fbbf24); }
.gm-k time { color: var(--muted); letter-spacing: 0.06em; }
.gm-dot { color: var(--muted); }
.gm-info h2 { margin: 0; font-size: 1.32rem; font-weight: 800; letter-spacing: -0.01em; line-height: 1.2; }
.gm-stats { display: flex; flex-wrap: wrap; gap: 8px; }
.gm-stat { display: inline-flex; align-items: center; gap: 9px; padding: 7px 13px 7px 8px; border-radius: 14px;
    background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.09); }
.gm-stat > span:last-child { display: grid; line-height: 1.1; }
.gm-stat b { font-size: 1.12rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.gm-stat small { font-size: 0.75rem; color: var(--muted); font-weight: 700; }
.gm-ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; font-size: 1.05rem; line-height: 1; font-style: normal; background: rgba(255,255,255,0.06); }
.gm-stat--streak { border-color: rgba(249,115,22,0.35); background: linear-gradient(180deg, rgba(249,115,22,0.14), rgba(249,115,22,0.04)); }
.gm-stat--streak b { color: #fdba74; }
.gm-stat--streak.is-hot .gm-ico { background: radial-gradient(circle at 50% 60%, rgba(249,115,22,0.55), rgba(249,115,22,0.12)); animation: gm-flame 1.8s ease-in-out infinite; }
@keyframes gm-flame { 50% { box-shadow: 0 0 16px rgba(249,115,22,0.55); } }
.gm-stat--streak.is-up b { animation: gm-up 0.8s cubic-bezier(.2,.9,.3,1.5); }
@keyframes gm-up { 40% { transform: scale(1.45); color: #fff; } }
.gm-stat--shield { cursor: help; border-color: rgba(34,211,238,0.28); }
.gm-stat--shield b { color: #67e8f9; font-size: 0.95rem; }
.gm-stat--shield.is-used { border-color: rgba(255,255,255,0.09); }
.gm-stat--shield.is-used b { color: var(--muted); }
.gm-stat--shield.is-used .gm-ico { filter: grayscale(1); opacity: 0.6; }
.gm-next { margin: 0; font-size: 0.85rem; color: var(--muted); }
.gm-next b { color: var(--text); }
.gm-next .gm-xp { color: var(--sun, #fbbf24); }

/* the right: today's wall */
.gm-wall { min-width: 0; display: grid; gap: 12px; align-content: center; padding: 14px 16px; border-radius: 18px;
    background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); }
.gm-wall-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.gm-wall-head small, .gm-wall-link { font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.gm-wall-link { text-decoration: none; transition: color 0.2s; }   /* gm4: to bascdao.com/gm */
.gm-wall-link span { display: inline-block; transition: transform 0.2s; }
.gm-wall-link:hover, .gm-wall-link:focus-visible { color: var(--sun, #fbbf24); }
.gm-wall-link:hover span, .gm-wall-link:focus-visible span { transform: translateX(3px); }
.gm-wall-head span { font-size: 0.85rem; color: var(--muted); }
.gm-wall-head b { font-size: 1.05rem; font-weight: 900; color: var(--text); font-variant-numeric: tabular-nums; }
.gm-faces { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; min-height: 38px; }
.gm-face { position: relative; width: 36px; height: 36px; border-radius: 50%; flex: none; cursor: pointer;
    animation: gm-face-in 0.45s cubic-bezier(.2,.9,.3,1.3) both; animation-delay: calc(var(--i, 0) * 30ms);
    transition: transform 0.2s cubic-bezier(.2,.9,.3,1.4); }
.gm-face img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
    box-shadow: 0 0 0 2px #1a0d2c, 0 0 0 3px rgba(251,191,36,0.45); }
.gm-face:hover, .gm-face:focus-visible { transform: translateY(-3px) scale(1.12); z-index: 1; }
.gm-face:focus-visible { outline: 2px solid var(--sun, #fbbf24); outline-offset: 3px; }
.gm-face.is-me img { box-shadow: 0 0 0 2px #1a0d2c, 0 0 0 4px var(--sun, #fbbf24), 0 0 18px rgba(251,191,36,0.6); }
.gm-face--more { display: grid; place-items: center; cursor: default; font-size: 0.75rem; font-weight: 900; color: var(--sun, #fbbf24);
    background: rgba(251,191,36,0.12); box-shadow: inset 0 0 0 1px rgba(251,191,36,0.35); }
.gm-face--more:hover { transform: none; }
@keyframes gm-face-in { from { opacity: 0; transform: scale(0.4); } }
.gm-empty { align-self: center; font-size: 0.85rem; color: var(--muted); }
.gm-x { justify-self: start; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; text-decoration: none;
    font-size: 0.88rem; font-weight: 800; color: #fff; background: #000; border: 1px solid rgba(255,255,255,0.22);
    box-shadow: 0 8px 20px -10px rgba(0,0,0,0.8); transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s; }
.gm-x[hidden] { display: none; }
.gm-x svg { width: 15px; height: 15px; fill: currentColor; }
.gm-x:hover, .gm-x:focus-visible { transform: translateY(-2px); border-color: rgba(251,191,36,0.6); box-shadow: 0 12px 26px -10px rgba(251,191,36,0.55); }
.gm-x.is-new { animation: gm-x-in 0.6s cubic-bezier(.2,.9,.3,1.4) both; }
@keyframes gm-x-in { from { opacity: 0; transform: translateY(8px) scale(0.9); } }

@media (max-width: 1100px) {
    .gm { grid-template-columns: auto minmax(0, 1fr); }
    .gm-wall { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    section.block.gm-block, section.block.gm-block.first { padding-top: 22px; }
    .gm { grid-template-columns: 1fr; justify-items: stretch; gap: 16px; padding: 18px 14px 14px; border-radius: 20px; text-align: center; }
    .gm-say { padding: 22px 0 6px; }
    .gm-btn { width: 132px; height: 132px; }
    .gm-word { font-size: 2rem; }
    .gm-sub { max-width: 96px; }
    .gm-info { justify-items: center; }
    .gm-k { justify-content: center; }
    .gm-info h2 { font-size: 1.15rem; }
    .gm-stats { justify-content: center; gap: 6px; }
    .gm-stat { padding: 6px 10px 6px 6px; gap: 7px; }
    .gm-ico { width: 28px; height: 28px; font-size: 0.95rem; }
    .gm-wall { text-align: left; padding: 12px; }
    .gm-x { justify-self: stretch; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
    .gm-rays, .gm-btn:not(:disabled) .gm-sun, .gm.is-burst .gm-btn, .gm.is-burst .gm-rays, .gm-stat--streak.is-hot .gm-ico,
    .gm-stat--streak.is-up b, .gm-face, .gm-x.is-new { animation: none; }
    .gm-pop.is-on { animation: none; opacity: 1; transform: translate(-50%, -26px); }
    .gm-btn, .gm-face, .gm-x { transition: none; }
}

/* the streak pill on /profile and /ape/<name> (2 days or more, alive) */
.gm-pill { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px 3px 8px; border-radius: 999px; font-size: 0.78rem; font-weight: 800;
    color: #fdba74; background: rgba(249,115,22,0.12); border: 1px solid rgba(249,115,22,0.35); white-space: nowrap; }
.gm-pill > span { font-style: normal; line-height: 1; }

/* bascdao.com/gm/<user>/<day> (templates/gm_share.html), over the invite page's look (invite.css) */
.gm-hero .inv-rays { background: repeating-conic-gradient(from 0deg, rgba(251,191,36,0.30) 0deg 6deg, transparent 6deg 20deg); }
.gm-hero .inv-ape { position: relative; }
.gm-hero-sun { position: absolute; right: -14px; top: -14px; z-index: 2; display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%;
    font-size: 2.2rem; line-height: 1; font-style: normal;
    background: radial-gradient(circle at 50% 35%, #fff3c4, #fbbf24 50%, #f97316); box-shadow: 0 0 40px rgba(251,191,36,0.65), 0 10px 24px -8px rgba(249,115,22,0.8); }
.gm-hero-word { background: linear-gradient(90deg, #fde68a, #fbbf24 40%, #f97316); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gm-hero-stats { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 18px; }
.gm-hero .inv-note + .inv-cta { margin-top: 18px; }   /* gm2: air between the note and the button */
.gm-join { background: linear-gradient(135deg, #fbbf24, #f97316); color: #1a0b02; }
.gm-faces--big { gap: 10px; }
.gm-faces--big .gm-face { width: 52px; height: 52px; }
.gm-faces--big .gm-face--more { font-size: 0.85rem; }
@media (max-width: 640px) {
    .gm-hero-sun { width: 56px; height: 56px; font-size: 1.6rem; right: -6px; top: -6px; }
    .gm-hero-stats { justify-content: center; }
    .gm-faces--big .gm-face { width: 44px; height: 44px; }
}
.gm-hero .eyebrow { color: #fbbf24; border-color: rgba(251,191,36,0.35); background: rgba(251,191,36,0.08); }
.gm-hero .eyebrow::before { background: #fbbf24; box-shadow: 0 0 10px rgba(251,191,36,0.7); }

/* gm4 (Mortimer, 05-11-2026: «no hay ninguna página tipo https://bascdao.com/gm ??? no deberíamos tenerla?»): bascdao.com/gm
   (templates/gm_hub.html). The hero's sun with today's faces round it, the two boards of streaks and the last 7 days. */
.gmh-sun-box { width: min(100%, 380px); margin: 0 auto; }
.gmh-sun { position: relative; z-index: 1; display: grid; place-items: center; align-content: center; width: 46%; aspect-ratio: 1; border-radius: 50%; color: #1a0b02;
    background: radial-gradient(circle at 50% 32%, #fff3c4, #fbbf24 46%, #f97316 100%);
    box-shadow: 0 0 0 10px rgba(251,191,36,0.12), 0 0 80px rgba(251,191,36,0.55), 0 24px 44px -12px rgba(249,115,22,0.8), inset 0 -10px 22px rgba(194,65,12,0.35), inset 0 8px 18px rgba(255,255,255,0.55);
    animation: gmh-breathe 5s ease-in-out infinite; }
.gmh-sun b { font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 900; letter-spacing: -0.03em; line-height: 0.95; }
.gmh-sun small { font-size: 0.8rem; font-weight: 900; letter-spacing: 0.04em; opacity: 0.8; }
@keyframes gmh-breathe { 50% { transform: scale(1.03); box-shadow: 0 0 0 14px rgba(251,191,36,0.10), 0 0 110px rgba(251,191,36,0.6), 0 24px 44px -12px rgba(249,115,22,0.8), inset 0 -10px 22px rgba(194,65,12,0.35), inset 0 8px 18px rgba(255,255,255,0.55); } }
.gmh-orbit { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; animation: inv-turn 120s linear infinite; }
.gmh-orbit li { position: absolute; left: 50%; top: 50%; width: 15%; aspect-ratio: 1; margin: -7.5% 0 0 -7.5%;
    transform: rotate(calc(360deg / var(--n) * var(--i))) translateY(-200%) rotate(calc(-360deg / var(--n) * var(--i))); }
.gmh-orbit img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; animation: inv-turn 120s linear infinite reverse;
    box-shadow: 0 0 0 3px #1a0d2c, 0 0 0 5px rgba(251,191,36,0.7), 0 8px 18px rgba(0,0,0,0.45); }

.gmh-boards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.gmh-board { min-width: 0; padding: 22px 20px 16px; border-radius: 22px; border: 1px solid rgba(251,191,36,0.18);
    background: radial-gradient(420px 200px at 0% 0%, rgba(251,191,36,0.10), transparent 70%), linear-gradient(160deg, #170a2a, #0b0520); }
.gmh-board + .gmh-board { border-color: rgba(34,211,238,0.18); background: radial-gradient(420px 200px at 0% 0%, rgba(34,211,238,0.08), transparent 70%), linear-gradient(160deg, #170a2a, #0b0520); }
.gmh-board-head h2 { margin: 6px 0 6px; font-size: 1.45rem; }
.gmh-board-head p { margin: 0 0 14px; color: var(--muted); font-size: 0.88rem; }
.gmh-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.gmh-row { display: grid; grid-template-columns: 30px 40px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px 12px 8px 8px; border-radius: 14px;
    background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); transition: background 0.2s, border-color 0.2s, transform 0.2s; }
.gmh-row:hover { background: rgba(255,255,255,0.055); border-color: rgba(255,255,255,0.12); transform: translateX(2px); }
.gmh-row.is-me { border-color: rgba(251,191,36,0.5); background: rgba(251,191,36,0.08); }
.gmh-n { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; font-weight: 900; font-size: 0.9rem; color: var(--muted); background: rgba(255,255,255,0.05); font-variant-numeric: tabular-nums; }
.gmh-row.is-top .gmh-n { color: #1a0b02; background: linear-gradient(135deg, #fde68a, #f59e0b); }
.gmh-row img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; cursor: pointer; box-shadow: 0 0 0 2px #1a0d2c, 0 0 0 3px rgba(251,191,36,0.4); }
.gmh-who { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-width: 0; }
.gmh-who a, .gmh-who b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 800; color: #fff; text-decoration: none; }
.gmh-who a:hover { text-decoration: underline; text-underline-offset: 3px; }
.gmh-who .umc-pill { display: inline-flex; flex: none; padding: 1px 8px; white-space: nowrap; }   /* «JUNGLE APE · LV 24» never on two lines */
.gmh-who small { flex-basis: 100%; font-size: 0.75rem; color: var(--muted); }
.gmh-ok { color: #4ade80; font-weight: 800; }
.gmh-ok--hot { color: #fb923c; }   /* a best streak still running: not «Ended» */
.gmh-val { display: inline-flex; align-items: baseline; gap: 5px; white-space: nowrap; font-style: normal; }
.gmh-val b { font-size: 1.25rem; font-weight: 900; color: #fdba74; font-variant-numeric: tabular-nums; }
.gmh-board + .gmh-board .gmh-val b { color: #67e8f9; }
.gmh-val small { font-size: 0.75rem; color: var(--muted); font-weight: 700; }
.gmh-empty { margin: 0; padding: 18px; border-radius: 14px; text-align: center; color: var(--muted); background: rgba(255,255,255,0.03); }

.gmh-bars { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); align-items: end; gap: 12px; height: 220px; margin: 0; padding: 18px 20px 14px; list-style: none;
    border-radius: 22px; border: 1px solid rgba(255,255,255,0.08); background: linear-gradient(180deg, rgba(251,191,36,0.05), rgba(255,255,255,0.02)); }
.gmh-bars li { display: grid; grid-template-rows: auto 1fr auto; justify-items: center; gap: 6px; height: 100%; min-width: 0; }
.gmh-bars b { font-size: 0.9rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.gmh-bar { position: relative; display: block; width: min(56px, 100%); height: 100%; border-radius: 12px 12px 6px 6px; background: rgba(255,255,255,0.04); overflow: hidden; }
.gmh-bar i { position: absolute; left: 0; right: 0; bottom: 0; height: max(4px, calc(var(--p, 0) * 1%)); border-radius: inherit;
    background: linear-gradient(180deg, #fde68a, #f97316); box-shadow: 0 0 18px rgba(249,115,22,0.35); transform-origin: bottom; animation: gmh-grow 0.9s cubic-bezier(.2,.9,.3,1) both; }
.gmh-bars li:nth-child(2) i { animation-delay: 60ms; } .gmh-bars li:nth-child(3) i { animation-delay: 120ms; } .gmh-bars li:nth-child(4) i { animation-delay: 180ms; }
.gmh-bars li:nth-child(5) i { animation-delay: 240ms; } .gmh-bars li:nth-child(6) i { animation-delay: 300ms; } .gmh-bars li:nth-child(7) i { animation-delay: 360ms; }
@keyframes gmh-grow { from { transform: scaleY(0); } }
.gmh-bars small { font-size: 0.78rem; color: var(--muted); font-weight: 700; }
.gmh-bars .is-today small { color: var(--sun, #fbbf24); }
.gmh-bars .is-today .gmh-bar { box-shadow: inset 0 0 0 1px rgba(251,191,36,0.45); }
@media (max-width: 900px) { .gmh-boards { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
    .gmh-sun-box { width: min(78%, 300px); }
    .gmh-board { padding: 18px 12px 12px; }
    .gmh-row { grid-template-columns: 26px 36px minmax(0, 1fr) auto; gap: 9px; padding: 7px 9px 7px 7px; }
    .gmh-n { width: 26px; height: 26px; }
    .gmh-row img { width: 36px; height: 36px; }
    .gmh-val small { display: none; }   /* «🔥 31»: room for the rank pill */
    .gmh-bars { gap: 6px; height: 180px; padding: 14px 10px 10px; }
    .gmh-bars b { font-size: 0.78rem; }
}
@media (prefers-reduced-motion: reduce) {
    .gmh-sun, .gmh-orbit, .gmh-orbit img, .gmh-bar i { animation: none; }
    .gmh-row { transition: none; }
}