/* =============================================================================
Coach Max on eatsleeprep.com: corner launcher, talking intro and chat panel.
Chalk & Iron: iron black, chalk white, safety orange; Anton for display.
============================================================================= */
.gg.mx{--brand:#FF4B23;--ink:#F1EFE9;--line:#2c2c2c;--soft:#121212;--font:Oswald,'Arial Narrow',sans-serif;--shadow-lg:0 18px 40px rgba(0,0,0,.5)}
.gg{position:fixed;right:14px;bottom:18px;z-index:95;font-family:var(--font);font-size:15px;line-height:1.45}
.gg *{box-sizing:border-box}
.gg [hidden]{display:none!important}
.gg-launch{display:flex;flex-direction:column;align-items:center;background:none;border:0;padding:0;cursor:pointer;color:inherit}
.gg-fig{display:block;height:320px;filter:drop-shadow(0 10px 14px rgba(14,20,32,.22));transition:transform .3s ease}
.gg-launch:hover .gg-fig{transform:translateY(-4px)}
.gg-fig img,.gg-fig canvas{display:block;height:100%;width:auto}
.gg-fig canvas{aspect-ratio:300/534}
.gg-label{margin-top:-12px;position:relative;background:var(--brand);color:#fff;font-family:Anton,Impact,sans-serif;font-weight:400;letter-spacing:.05em;text-transform:uppercase;font-size:1rem;
padding:8px 16px;border-radius:100px;box-shadow:0 8px 26px rgba(0,0,0,.22)}
.gg-say{position:absolute;right:6px;bottom:calc(100% + 10px);width:270px;background:#F1EFE9;color:#0C0C0C;
border:1px solid var(--line);border-radius:16px;padding:11px 14px;font-size:.9rem;box-shadow:var(--shadow-lg)}
.gg-say b{color:var(--brand)}
.gg-video{position:fixed;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.gg-panel{width:min(380px,calc(100vw - 24px));height:min(580px,calc(100vh - 40px));height:min(580px,calc(100dvh - 40px));
background:#0C0C0C;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.6),0 0 0 1px var(--line);
display:flex;flex-direction:column;overflow:hidden}
.gg-head{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px;background:var(--brand);color:#fff}
.gg-head b{display:block;font-family:Anton,Impact,sans-serif;font-weight:400;letter-spacing:.04em;text-transform:uppercase;font-size:1.15rem;color:#fff}
.gg-head small{display:block;font-size:.75rem;opacity:.85}
.gg-face{flex:0 0 auto;width:38px;height:38px;border-radius:50%;overflow:hidden;background:#fff0f4;box-shadow:0 0 0 2px rgba(255,255,255,.7)}
.gg-face img{width:100%;height:100%;object-fit:cover;display:block}
.gg-face.sm{width:26px;height:26px;box-shadow:none}
.gg-face.talking{animation:gg-pulse 1s ease-in-out infinite}
.gg-ico{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;
background:none;border:0;color:#fff;cursor:pointer}
.gg-ico+.gg-ico{margin-left:0}
.gg-ico:hover{background:rgba(255,255,255,.16)}
.gg-ico svg{width:18px;height:18px}
.gg-body{flex:1;overflow-y:auto;padding:14px;background:var(--soft);display:flex;flex-direction:column;gap:10px}
.gg-msg{display:flex;align-items:flex-end;gap:8px}
.gg-msg.me{justify-content:flex-end}
.gg-msg p{margin:0;max-width:82%;padding:9px 13px;border-radius:16px;font-size:.92rem;white-space:pre-wrap;background:#1F1F1F;color:var(--ink);
box-shadow:0 1px 2px rgba(14,20,32,.06)}
.gg-msg.me p{background:var(--brand);color:#fff}
.gg-msg p a{color:#FF7A5C;font-weight:700;text-decoration:underline}
.gg-dots i{display:inline-block;width:6px;height:6px;margin:0 2px;border-radius:50%;background:#9aa3b2;animation:gg-dot 1s infinite}
.gg-dots i:nth-child(2){animation-delay:.15s}.gg-dots i:nth-child(3){animation-delay:.3s}
.gg-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 14px 0;background:#0C0C0C}
.gg-chips button{border:1px solid var(--brand);background:transparent;color:var(--ink);text-transform:uppercase;letter-spacing:.03em;border-radius:100px;padding:5px 11px;font-size:.8rem;cursor:pointer;font-family:var(--font)}
.gg-chips button:hover{border-color:var(--brand);color:var(--brand)}
.gg-form{display:flex;align-items:center;gap:8px;padding:10px;border-top:1px solid var(--line);background:#0C0C0C}
.gg-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:100px;padding:10px 14px;font:inherit;font-size:.92rem;outline:none;background:#161616;color:var(--ink)}
.gg-form input:focus{border-color:var(--brand)}
.gg-round{flex:0 0 auto;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#161616;color:var(--ink);
display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.gg-round svg{width:18px;height:18px}
.gg-round.go{background:var(--brand);border-color:var(--brand);color:#fff}
.gg-round:disabled{opacity:.55;cursor:default}
.gg-round.on{background:var(--brand);border-color:var(--brand);color:#fff;animation:gg-pulse 1.2s ease-in-out infinite}
.gg-foot{margin:0;padding:0 14px 6px;background:#0C0C0C;text-align:center;font-size:.72rem;color:#7a8394}
.gg-foot a{color:inherit;text-decoration:underline}
.gg-credit{padding-bottom:10px;opacity:.85}
@keyframes gg-pulse{0%,100%{box-shadow:0 0 0 2px rgba(255,255,255,.7)}50%{box-shadow:0 0 0 5px rgba(255,255,255,.35)}}
@keyframes gg-dot{0%,80%,100%{opacity:.3}40%{opacity:1}}
@media(max-width:960px){
.gg{right:8px;bottom:12px}
.gg-fig{height:210px}
.gg-label{font-size:.85rem;padding:6px 13px}
.gg-say{width:230px;font-size:.85rem}
.gg-panel{height:min(560px,calc(100dvh - 96px))}
}
@media(prefers-reduced-motion:reduce){.gg-fig,.gg-face.talking,.gg-round.on,.gg-dots i{animation:none;transition:none}}
@media print{.gg{display:none}}
/* ── Phone launcher ──────────────────────────────────────────────────────
At 393px the 210px figure plus the ASK COACH MAX pill lay across the email
field and the submit button, and the intro bubble covered the wordmark.
A 60px face in the corner is what every chat widget does, and for the same
reason. Max still arrives full-size in the intro clip and at the top of
the chat panel. The canvas matters: during the intro max.js swaps the
![]()
for a