/* "Coach" in-app browser escape (assets/js/coach.js). Self-contained colours so it works on every page. */
.cc-inapp{--cc-ink:#2a1709;--cc-honey:#ffb627;--cc-paper:#fffaf1;--cc-cream:#fff4e0;--cc-line:rgba(42,23,9,.14);
  --cc-display:'Bagel Fat One',system-ui,-apple-system,sans-serif;--cc-body:'DM Sans',system-ui,-apple-system,sans-serif;--cc-mono:'DM Mono',ui-monospace,monospace;}

/* hint chip, always on, pointing up at ••• */
.cc-hint{position:fixed;right:10px;top:10px;z-index:56;display:flex;align-items:center;gap:8px;max-width:calc(100% - 20px);
  padding:8px 12px 8px 8px;border-radius:14px;border:2.5px solid var(--cc-ink);background:var(--cc-paper);color:var(--cc-ink);box-shadow:0 4px 0 var(--cc-ink);
  font:600 .84rem/1.25 var(--cc-body);text-align:left;cursor:pointer;animation:ccbob 2.4s ease-in-out infinite;}
.cc-hint b{font-weight:800;}
.cc-hint-up{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:var(--cc-honey);border:2px solid var(--cc-ink);font-weight:800;}
.cc-hint::before{content:"";position:absolute;right:16px;top:-9px;width:14px;height:14px;background:var(--cc-paper);border-left:2.5px solid var(--cc-ink);border-top:2.5px solid var(--cc-ink);transform:rotate(45deg);}
@keyframes ccbob{50%{transform:translateY(-5px);}}
.cc-open .cc-hint{opacity:0;pointer-events:none;}

/* after "Got it": a big arrow at the app's ••• (it sits just above the page, top right) */
.cc-up{position:fixed;right:8px;top:calc(4px + env(safe-area-inset-top));z-index:92;display:none;flex-direction:column;align-items:flex-end;gap:2px;pointer-events:none;
  color:var(--cc-ink);font:800 .9rem/1.1 var(--cc-body);}
.cc-up span{display:grid;place-items:center;width:52px;height:52px;margin-right:2px;border-radius:50%;background:var(--cc-honey);border:3px solid var(--cc-ink);
  font-size:1.8rem;line-height:1;animation:ccbob 1s ease-in-out infinite;box-shadow:0 0 0 0 rgba(255,182,39,.7);}
.cc-up b{padding:4px 9px;border-radius:999px;background:var(--cc-ink);color:var(--cc-honey);}
.cc-spot .cc-up{display:flex;}
.cc-spot .cc-hint{opacity:0;}

/* coach card */
.cc{position:fixed;inset:0;z-index:80;}
.cc[hidden]{display:none;}
.cc-dim{position:absolute;inset:0;background:rgba(20,10,3,.72);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .3s;}
.cc.on .cc-dim{opacity:1;}
.cc-card{position:absolute;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));width:min(calc(100% - 24px),420px);
  padding:18px 16px 16px;border-radius:28px;border:3px solid var(--cc-ink);background:var(--cc-cream);color:var(--cc-ink);box-shadow:0 8px 0 var(--cc-ink);
  font-family:var(--cc-body);transform:translate(-50%,120%);transition:transform .45s cubic-bezier(.2,1.25,.4,1);}
.cc.on .cc-card{transform:translate(-50%,0);}
.cc-k{margin:0;font:500 .72rem/1.3 var(--cc-mono);letter-spacing:.1em;text-transform:uppercase;color:#c2410c;}
.cc-card h3{font-family:var(--cc-display);font-weight:400;font-size:1.9rem;line-height:1;margin:4px 0 14px;letter-spacing:0;}
.cc-chip{display:inline-block;padding:1px 8px;border-radius:7px;background:var(--cc-ink);color:var(--cc-honey);font:500 .9em/1.4 var(--cc-mono);white-space:nowrap;}
.cc-steps .cc-chip{white-space:normal;}
.cc-steps li > span{min-width:0;}
.cc-body{display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:center;}
.cc-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px;}
.cc-steps li{display:flex;gap:9px;align-items:center;padding:9px 10px;border-radius:14px;border:2px solid var(--cc-line);font-size:.9rem;font-weight:600;line-height:1.3;animation:7s linear infinite;}
.cc-steps li > b{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--cc-ink);color:var(--cc-honey);font:500 .75rem/1 var(--cc-mono);}
.cc-steps li:nth-child(1){animation-name:ccs1;}.cc-steps li:nth-child(2){animation-name:ccs2;}.cc-steps li:nth-child(3){animation-name:ccs3;}
@keyframes ccs1{0%,27%{background:#ffe2a6;border-color:var(--cc-ink);}29%,100%{background:transparent;border-color:var(--cc-line);}}
@keyframes ccs2{0%,27%{background:transparent;border-color:var(--cc-line);}29%,55%{background:#ffe2a6;border-color:var(--cc-ink);}57%,100%{background:transparent;border-color:var(--cc-line);}}
@keyframes ccs3{0%,55%{background:transparent;border-color:var(--cc-line);}57%,98%{background:#ffe2a6;border-color:var(--cc-ink);}100%{background:transparent;}}
.cc-btns{display:grid;gap:8px;margin-top:14px;}
.cc-go,.cc-copy{min-height:50px;border-radius:999px;border:3px solid var(--cc-ink);font:700 1rem/1 var(--cc-body);cursor:pointer;color:var(--cc-ink);}
.cc-go{background:var(--cc-honey);box-shadow:0 4px 0 var(--cc-ink);}
.cc-copy{background:var(--cc-paper);}

/* the looping mini phone: tap ••• → tap "Open in browser" → Safari → tap Order → Telegram */
.cc-phone{position:relative;width:132px;height:236px;border-radius:22px;border:3px solid var(--cc-ink);background:#fff4e0;overflow:hidden;}
.cc-phone .m-bar{position:absolute;left:0;right:0;top:0;height:26px;display:flex;align-items:center;gap:6px;padding:0 6px;background:#121212;color:#fff;font-size:10px;}
.cc-phone .m-bar i{flex:1;height:5px;border-radius:3px;background:rgba(255,255,255,.35);}
.cc-phone .m-dots{font-size:14px;line-height:1;padding:0 2px;border-radius:6px;animation:ccdots 7s infinite;}
@keyframes ccdots{0%,11%,24%,100%{background:transparent;}13%,22%{background:var(--cc-honey);color:#111;}}
.cc-phone .m-page{position:absolute;inset:34px 10px 10px;display:grid;gap:8px;align-content:start;}
.cc-phone .m-page i{height:8px;border-radius:4px;background:rgba(42,23,9,.15);}
.cc-phone .m-page i.s{width:60%;}
.cc-phone .m-order{margin-top:22px;justify-self:center;padding:6px 16px;border-radius:999px;border:2px solid var(--cc-ink);background:linear-gradient(105deg,#ffb627,#ff8fb1,#7cc8ff);font:700 11px/1 var(--cc-body);animation:ccorder 7s infinite;}
@keyframes ccorder{0%,64%,78%,100%{transform:none;}68%,74%{transform:scale(.9);}}
.cc-phone .m-sheet{position:absolute;left:0;right:0;bottom:0;padding:8px 6px 10px;display:grid;gap:3px;background:#1f1f1f;color:#fff;font:600 9.5px/1.2 system-ui,sans-serif;border-radius:12px 12px 0 0;
  transform:translateY(100%);animation:ccsheet 7s infinite;}
.cc-phone .m-sheet span{padding:7px 8px;border-radius:7px;}
.cc-phone .m-open{animation:ccopen 7s infinite;}
@keyframes ccsheet{0%,17%{transform:translateY(100%);}22%,46%{transform:none;}50%,100%{transform:translateY(100%);}}
@keyframes ccopen{0%,33%,46%,100%{background:transparent;color:#fff;}36%,45%{background:var(--cc-honey);color:#111;}}
.cc-phone .m-safari{position:absolute;left:0;right:0;top:0;height:26px;display:flex;align-items:center;gap:6px;padding:0 8px;background:#f2f2f2;opacity:0;animation:ccsaf 7s infinite;}
.cc-phone .m-safari i{flex:1;height:12px;border-radius:6px;background:#ddd;}
.cc-phone .m-compass{width:12px;height:12px;border-radius:50%;background:conic-gradient(#ff3b30 0 25%,#1e90ff 0 50%,#ff3b30 0 75%,#1e90ff 0);}
@keyframes ccsaf{0%,50%{opacity:0;}54%,96%{opacity:1;}100%{opacity:0;}}
.cc-phone .m-tg{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:#2aabee;color:#fff;display:grid;place-items:center;
  transform:scale(0);animation:cctg 7s infinite;}
.cc-phone .m-tg svg{width:28px;height:28px;}
@keyframes cctg{0%,75%{transform:scale(0);}80%{transform:scale(1.15);}84%,95%{transform:scale(1);}100%{transform:scale(0);}}
.cc-phone .m-finger{position:absolute;left:0;top:0;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:rgba(42,23,9,.35);box-shadow:0 0 0 3px rgba(255,255,255,.9);
  animation:ccfinger 7s infinite;}
@keyframes ccfinger{
  0%{transform:translate(66px,170px);}
  11%{transform:translate(116px,13px);}
  13%{transform:translate(116px,13px) scale(.7);}
  16%,26%{transform:translate(116px,13px);}
  33%{transform:translate(40px,168px);}
  36%{transform:translate(40px,168px) scale(.7);}
  40%,58%{transform:translate(40px,168px);}
  66%{transform:translate(66px,128px);}
  69%{transform:translate(66px,128px) scale(.7);}
  73%,100%{transform:translate(66px,128px);}
}

@media (max-width:360px){.cc-body{grid-template-columns:1fr;}.cc-phone{justify-self:center;}}
@media (prefers-reduced-motion:reduce){
  .cc-hint,.cc-up span{animation:none;}
  .cc-card{transition:none;}
}
/* WhatsApp links get a green app icon in the mini phone */
.cc-phone .m-tg .m-wa{display:none;}
.cc[data-target="sms/imessage"] .m-tg{background:#34c759;}
.cc[data-target="sms/imessage"] .m-tg::after{content:"SMS";font:800 13px system-ui,sans-serif;}
.cc[data-target="sms/imessage"] .m-tg svg{display:none;}
.cc[data-target="whatsapp"] .m-tg{background:#25d366;}
.cc[data-target="whatsapp"] .m-tg .m-wa{display:block;}
.cc[data-target="whatsapp"] .m-tg .m-tgi{display:none;}
