/* The map remains touchable through the illustration; only Close takes input. */
.pitch-hint{position:absolute;z-index:24;left:20px;bottom:calc(80px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:10px;max-width:calc(100vw - 112px);padding:8px 6px 8px 12px;border:1px solid #ffffff30;border-radius:24px;background:#25342df2;color:#fffdf5;box-shadow:0 3px 16px #081a1526;pointer-events:none;user-select:none;-webkit-user-select:none;animation:pitch-hint-appear 5.5s ease both}
.pitch-hint>span{font-size:13px;line-height:1.4;font-weight:500;letter-spacing:.05px}
.pitch-hint-gesture{width:42px;height:48px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pitch-hint-fingers{fill:#fffdf51a;animation:pitch-hint-slide 1.8s ease-in-out 2}
.pitch-hint-arrow{opacity:.65}
.pitch-hint>button{pointer-events:auto;flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;padding:10px;background:transparent;color:inherit;cursor:pointer}
.pitch-hint>button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.pitch-hint>button:focus-visible{outline:2px solid #fffdf5;outline-offset:-5px}
@keyframes pitch-hint-slide{0%,12%{transform:translateY(5px);opacity:.4}45%,65%{transform:translateY(-13px);opacity:1}90%,100%{transform:translateY(-13px);opacity:0}}
@keyframes pitch-hint-appear{0%,100%{opacity:0}5%,92%{opacity:1}}
@media(prefers-reduced-motion:reduce){.pitch-hint,.pitch-hint-fingers{animation:none}}
@media(max-width:360px){.pitch-hint{left:14px;gap:7px;padding-left:8px;max-width:calc(100vw - 100px)}.pitch-hint>span{font-size:12px}.pitch-hint-gesture{width:34px}}
