diff --git a/src/InvitationPage.jsx b/src/InvitationPage.jsx
index 008f093f..f7f4cc64 100644
--- a/src/InvitationPage.jsx
+++ b/src/InvitationPage.jsx
@@ -17,6 +17,7 @@ import {
   getInvitePreview,
   claimInvite,
   acceptInvite,
+  rejectInvite,
 } from "./services/invites";
 import { forgotPassword, login, signup } from "./services/auth";
 import { getMatch } from "./services/matches";
@@ -49,6 +50,7 @@ export default function InvitationPage() {
   const [agreeTerms, setAgreeTerms] = useState(false);
   const [claiming, setClaiming] = useState(false);
   const [archivedNotice, setArchivedNotice] = useState(false);
+  const [declining, setDeclining] = useState(false);
   const [authMode, setAuthMode] = useState("signIn");
   const [signInEmail, setSignInEmail] = useState("");
   const [signInPassword, setSignInPassword] = useState("");
@@ -823,6 +825,56 @@ export default function InvitationPage() {
     }
   };
 
+  const handleDecline = useCallback(async () => {
+    if (!token) return;
+    setError("");
+    setToast(null);
+    setDeclining(true);
+    try {
+      await rejectInvite(token);
+      setPreview((prev) =>
+        prev
+          ? {
+              ...prev,
+              status: "rejected",
+            }
+          : prev,
+      );
+      setPhase("preview");
+      setAuthMode("signIn");
+      setShowForgotPassword(false);
+    } catch (err) {
+      if (isMatchArchivedError(err)) {
+        setArchivedNotice(true);
+        const archivedMessage = "This match has been archived. Invites are read-only.";
+        setError(archivedMessage);
+        setToast({ type: "error", message: archivedMessage });
+      } else if (
+        err?.status === 404 ||
+        err?.response?.status === 404 ||
+        err?.message === "not_found"
+      ) {
+        setPreview(null);
+        setLoadError({
+          emoji: "🔍",
+          title: "Invite not found",
+          message:
+            "This invite is no longer available. Ask the host to send a new link.",
+        });
+      } else {
+        setToast({
+          type: "error",
+          message:
+            err?.response?.data?.message ||
+            err?.message ||
+            "We couldn't decline this invite. Try again later.",
+        });
+      }
+    } finally {
+      setDeclining(false);
+    }
+  }, [token]);
+
   // Render states
   if (loading)
     return (
@@ -877,6 +929,20 @@ export default function InvitationPage() {
         />
       </InvitationLayout>
     );
+  if (preview.status === "rejected") {
+    const hostName = (preview?.inviter?.full_name || "").trim();
+    const hostFirstName = hostName.split(" ").filter(Boolean)[0] || "";
+    const hostDisplay = hostFirstName || "the host";
+    return (
+      <InvitationLayout>
+        <StatusCard
+          emoji="👋"
+          title="Invite declined"
+          message={`We've let ${hostDisplay} know you can't make this match. You're welcome back anytime.`}
+        />
+      </InvitationLayout>
+    );
+  }
 
   const startDate = match.start_date_time
     ? new Date(match.start_date_time)
@@ -925,6 +991,9 @@ export default function InvitationPage() {
   const inviterFirstName = inviterName.split(" ").filter(Boolean)[0] || "";
   const inviterInitials = getAvatarInitials(inviterName || "Matchplay");
   const inviterAvatarUrl = getAvatarUrlFromPlayer(preview?.inviter);
+  const declineInviteMessage = `Can't make it? We'll let ${
+    inviterFirstName || "the host"
+  } know when you decline.`;
 
   const maskedIdentifier = preview?.maskedIdentifier;
   const isInviteeClaim = inviteeRequiresAccountClaim;
@@ -1078,6 +1147,14 @@ export default function InvitationPage() {
           </>
         )}
       </PrimaryButton>
+      <button
+        type="button"
+        onClick={handleDecline}
+        disabled={declining || claiming || isArchivedMatch}
+        className="inline-flex w-full items-center justify-center gap-2 rounded-2xl border border-slate-200 bg-white px-6 py-3 text-sm font-semibold text-slate-600 transition hover:bg-slate-50 focus:outline-none focus:ring-4 focus:ring-slate-200 disabled:cursor-not-allowed disabled:opacity-60"
+      >
+        {declining ? "Declining invite..." : "Can't make it? Decline invite"}
+      </button>
       {error && <ErrorText>{error}</ErrorText>}
     </form>
   );
@@ -1304,6 +1381,14 @@ export default function InvitationPage() {
           </PrimaryButton>
         </form>
       )}
+      <button
+        type="button"
+        onClick={handleDecline}
+        disabled={declining || authSubmitting || isArchivedMatch}
+        className="inline-flex w-full items-center justify-center gap-2 rounded-2xl border border-slate-200 bg-white px-6 py-3 text-sm font-semibold text-slate-600 transition hover:bg-slate-50 focus:outline-none focus:ring-4 focus:ring-slate-200 disabled:cursor-not-allowed disabled:opacity-60"
+      >
+        {declining ? "Declining invite..." : "Can't make it? Decline invite"}
+      </button>
       {error && <ErrorText>{error}</ErrorText>}
     </div>
   );
@@ -1507,9 +1592,18 @@ export default function InvitationPage() {
                     Join Match &amp; Play
                     <ArrowRight className="h-4 w-4" />
                   </PrimaryButton>
+                  <button
+                    type="button"
+                    onClick={handleDecline}
+                    disabled={declining || isArchivedMatch}
+                    className="inline-flex w-full items-center justify-center gap-2 rounded-2xl border border-slate-200 bg-white px-6 py-3 text-sm font-semibold text-slate-600 transition hover:bg-slate-50 focus:outline-none focus:ring-4 focus:ring-slate-200 disabled:cursor-not-allowed disabled:opacity-60"
+                  >
+                    {declining ? "Declining invite..." : "Can't make it? Decline invite"}
+                  </button>
                   <p className="text-xs text-slate-500">
                     You'll be asked to sign in or create a free account to claim your spot.
                   </p>
+                  <p className="text-xs text-amber-900/80">{declineInviteMessage}</p>
                 </>
               )}
             </div>
@@ -1529,6 +1623,10 @@ export default function InvitationPage() {
           onToast={handleToast}
           formatDateTime={formatSuccessDateTime}
           onManageInvites={() => {}}
+          onDeclineInvite={handleDecline}
+          declineInviteLoading={declining}
+          declineInviteDisabled={isArchivedMatch}
+          declineInviteHelpText={declineInviteMessage}
           initialStatus="success"
         />
       )}
diff --git a/src/TennisMatchApp.jsx b/src/TennisMatchApp.jsx
index 2e7e4381..a40dd1bc 100644
--- a/src/TennisMatchApp.jsx
+++ b/src/TennisMatchApp.jsx
@@ -654,6 +654,11 @@ const TennisMatchApp = () => {
   const [viewMatch, setViewMatch] = useState(null);
   const [showMatchDetailsModal, setShowMatchDetailsModal] = useState(false);
   const [matchDetailsOrigin, setMatchDetailsOrigin] = useState("browse");
+  const [viewInviteContext, setViewInviteContext] = useState(null);
+  const [acceptingInviteFromDetails, setAcceptingInviteFromDetails] =
+    useState(false);
+  const [decliningInviteFromDetails, setDecliningInviteFromDetails] =
+    useState(false);
   const [pendingInvites, setPendingInvites] = useState([]);
   const [invitesLoading, setInvitesLoading] = useState(false);
   const [invitesError, setInvitesError] = useState("");
@@ -1795,6 +1800,9 @@ const TennisMatchApp = () => {
   const closeMatchDetailsModal = useCallback(() => {
     setShowMatchDetailsModal(false);
     setViewMatch(null);
+    setViewInviteContext(null);
+    setAcceptingInviteFromDetails(false);
+    setDecliningInviteFromDetails(false);
     if (matchDetailsOrigin === "browse") {
       goToBrowse({ replace: true });
     } else if (matchDetailsOrigin === "invites") {
@@ -1805,6 +1813,110 @@ const TennisMatchApp = () => {
     setMatchDetailsOrigin("browse");
   }, [goToBrowse, goToInvites, matchDetailsOrigin]);
 
+  const handleAcceptInviteFromDetails = useCallback(async () => {
+    const token = viewInviteContext?.token;
+    if (!token) return null;
+    const matchIdFromContext =
+      viewInviteContext?.matchId ||
+      viewMatch?.match?.id ||
+      viewMatch?.id ||
+      null;
+    setAcceptingInviteFromDetails(true);
+    try {
+      await acceptInvite(token);
+      displayToast("Invite accepted! See you on the court. 🎾");
+      await Promise.all([fetchPendingInvites(), fetchMatches()]);
+      setViewInviteContext((prev) =>
+        prev
+          ? {
+              ...prev,
+              invite: {
+                ...(prev.invite || {}),
+                status: "accepted",
+                accepted: true,
+                rejected: false,
+              },
+            }
+          : prev,
+      );
+      if (matchIdFromContext) {
+        const updated = await fetchMatchDetailsWithArchivedFallback(
+          matchIdFromContext,
+        );
+        if (updated) {
+          setViewMatch(updated);
+          return updated;
+        }
+      }
+      return null;
+    } catch (err) {
+      let message;
+      if (
+        isMatchArchivedError(err) ||
+        err?.response?.data?.error === MATCH_ARCHIVED_ERROR
+      ) {
+        message =
+          "This match has been archived. Invites can no longer be updated.";
+      } else {
+        message =
+          err?.response?.data?.message ||
+          err?.data?.message ||
+          err?.message ||
+          "Failed to accept invite";
+      }
+      displayToast(message, "error");
+      const errorObject = new Error(message);
+      errorObject.silent = true;
+      throw errorObject;
+    } finally {
+      setAcceptingInviteFromDetails(false);
+    }
+  }, [
+    viewInviteContext,
+    viewMatch,
+    displayToast,
+    fetchPendingInvites,
+    fetchMatches,
+    fetchMatchDetailsWithArchivedFallback,
+  ]);
+
+  const handleDeclineInviteFromDetails = useCallback(async () => {
+    const token = viewInviteContext?.token;
+    if (!token) return;
+    setDecliningInviteFromDetails(true);
+    try {
+      await rejectInvite(token);
+      displayToast("Invite declined", "info");
+      await Promise.all([fetchPendingInvites(), fetchMatches()]);
+      setViewInviteContext(null);
+      closeMatchDetailsModal();
+    } catch (err) {
+      const message = (() => {
+        if (
+          isMatchArchivedError(err) ||
+          err?.response?.data?.error === MATCH_ARCHIVED_ERROR
+        ) {
+          return "This match has been archived. Invites can no longer be updated.";
+        }
+        return (
+          err?.response?.data?.message ||
+          err?.data?.message ||
+          err?.message ||
+          "Failed to decline invite"
+        );
+      })();
+      displayToast(message, "error");
+    } finally {
+      setDecliningInviteFromDetails(false);
+    }
+  }, [
+    viewInviteContext,
+    displayToast,
+    fetchPendingInvites,
+    fetchMatches,
+    closeMatchDetailsModal,
+  ]);
+
   const handleManageInvitesFromDetails = useCallback(
     (matchId) => {
       if (!matchId) return;
@@ -1907,6 +2019,9 @@ const TennisMatchApp = () => {
               const data = await fetchMatchDetailsWithArchivedFallback(matchId);
               if (data) {
                 setMatchDetailsOrigin("browse");
+                setViewInviteContext({ token, matchId, invite });
+                setAcceptingInviteFromDetails(false);
+                setDecliningInviteFromDetails(false);
                 setViewMatch(data);
                 setShowMatchDetailsModal(true);
               }
@@ -1915,10 +2030,15 @@ const TennisMatchApp = () => {
                 throw error;
               }
             }
+          } else {
+            setViewInviteContext({ token, invite });
           }
         })
         .catch(() => {
           displayToast("Failed to open match", "error");
+          setViewInviteContext(null);
+          setAcceptingInviteFromDetails(false);
+          setDecliningInviteFromDetails(false);
         });
     }
   }, [
@@ -1927,7 +2047,8 @@ const TennisMatchApp = () => {
     fetchMatchDetailsWithArchivedFallback,
   ]);
 
-  const handleViewDetails = async (matchId) => {
+  const handleViewDetails = async (matchId, options = {}) => {
+    const { inviteToken, invite, origin } = options;
     try {
       const data = await fetchMatchDetailsWithArchivedFallback(matchId);
       if (!data) {
@@ -1937,10 +2058,22 @@ const TennisMatchApp = () => {
       if ((data.match || {}).status === "archived" && activeFilter !== "archived") {
         setActiveFilter("archived");
       }
-      setMatchDetailsOrigin(currentScreen);
+      if (inviteToken) {
+        setViewInviteContext({ token: inviteToken, matchId, invite: invite || null });
+      } else {
+        setViewInviteContext(null);
+      }
+      setAcceptingInviteFromDetails(false);
+      setDecliningInviteFromDetails(false);
+      setMatchDetailsOrigin(origin ?? currentScreen);
       setViewMatch(data);
       setShowMatchDetailsModal(true);
     } catch (err) {
+      if (inviteToken) {
+        setViewInviteContext(null);
+      }
+      setAcceptingInviteFromDetails(false);
+      setDecliningInviteFromDetails(false);
       if (isMatchArchivedError(err)) {
         displayToast("This match has been archived.", "error");
       } else {
@@ -2312,7 +2445,12 @@ const TennisMatchApp = () => {
                           </button>
                           {invite.match?.id && (
                             <button
-                              onClick={() => handleViewDetails(invite.match.id)}
+                              onClick={() =>
+                                handleViewDetails(invite.match.id, {
+                                  inviteToken: invite.token,
+                                  invite,
+                                })
+                              }
                               className="w-full px-3 py-1.5 rounded-xl bg-white/10 text-white font-bold text-xs border border-white/30 hover:bg-white/20 transition-colors"
                             >
                               View & manage
@@ -5555,6 +5693,38 @@ const TennisMatchApp = () => {
     }
   `;
 
+  const inviteDetails = viewInviteContext?.invite || null;
+  const inviteTokenForDetails = viewInviteContext?.token || null;
+  const inviteAccepted =
+    inviteDetails?.accepted === true ||
+    (typeof inviteDetails?.status === "string" &&
+      inviteDetails.status.toLowerCase() === "accepted") ||
+    (typeof inviteDetails?.state === "string" &&
+      inviteDetails.state.toLowerCase() === "accepted");
+  const inviteRejected =
+    inviteDetails?.rejected === true ||
+    (typeof inviteDetails?.status === "string" &&
+      inviteDetails.status.toLowerCase() === "rejected") ||
+    (typeof inviteDetails?.state === "string" &&
+      inviteDetails.state.toLowerCase() === "rejected");
+  const inviteIsPending = !inviteAccepted && !inviteRejected;
+  const shouldShowInviteActions = Boolean(inviteTokenForDetails && inviteIsPending);
+  const matchRecord = (viewMatch && viewMatch.match) || viewMatch || {};
+  const matchStatus = (matchRecord.status || "").toString().toLowerCase();
+  const inviteActionsDisabled =
+    matchStatus === "archived" || matchStatus === "cancelled";
+  const hostFullName =
+    matchRecord?.host_profile?.full_name ||
+    matchRecord?.host_name ||
+    viewMatch?.host_profile?.full_name ||
+    viewMatch?.host_name ||
+    inviteDetails?.inviter?.full_name ||
+    "";
+  const hostFirstName = hostFullName.trim().split(/\s+/)[0] || "the host";
+  const declineInviteHelpText = shouldShowInviteActions
+    ? `Can't make it? We'll let ${hostFirstName} know when you decline.`
+    : undefined;
+
   const shouldShowLanding = !currentUser && currentScreen === "browse";
 
   return (
@@ -5631,6 +5801,19 @@ const TennisMatchApp = () => {
         onToast={displayToast}
         formatDateTime={formatDateTime}
         onManageInvites={handleManageInvitesFromDetails}
+        onDeclineInvite={
+          shouldShowInviteActions ? handleDeclineInviteFromDetails : undefined
+        }
+        declineInviteLabel="Decline invite"
+        declineInviteLoading={decliningInviteFromDetails}
+        declineInviteDisabled={inviteActionsDisabled}
+        declineInviteHelpText={declineInviteHelpText}
+        onAcceptInvite={
+          shouldShowInviteActions ? handleAcceptInviteFromDetails : undefined
+        }
+        acceptInviteLabel="Accept invite"
+        acceptInviteLoading={acceptingInviteFromDetails}
+        acceptInviteDisabled={inviteActionsDisabled}
       />
       {Toast()}
       <ProfileManager
diff --git a/src/components/MatchDetailsModal.jsx b/src/components/MatchDetailsModal.jsx
index 4921342d..23134f52 100644
--- a/src/components/MatchDetailsModal.jsx
+++ b/src/components/MatchDetailsModal.jsx
@@ -471,6 +471,15 @@ const MatchDetailsModal = ({
   onToast,
   formatDateTime,
   onManageInvites,
+  onDeclineInvite,
+  declineInviteLabel,
+  declineInviteLoading = false,
+  declineInviteDisabled = false,
+  declineInviteHelpText,
+  onAcceptInvite,
+  acceptInviteLabel,
+  acceptInviteLoading = false,
+  acceptInviteDisabled = false,
   initialStatus,
   onViewPlayerProfile,
 }) => {
@@ -733,6 +742,25 @@ const MatchDetailsModal = ({
   }, [capacityInfo, remainingSpots]);
   const matchId = match?.id ?? null;
   const canManageInvites = Boolean(onManageInvites) && isHost && matchId;
+  const showDeclineInvite = typeof onDeclineInvite === "function";
+  const showAcceptInvite = typeof onAcceptInvite === "function";
+  const acceptInviteBusy = Boolean(acceptInviteLoading);
+  const acceptInviteDisabledProp = Boolean(acceptInviteDisabled);
+  const acceptInviteActionDisabled =
+    acceptInviteBusy || acceptInviteDisabledProp || isArchived || isCancelled;
+  const declineInviteBusy = Boolean(declineInviteLoading);
+  const declineInviteDisabledProp = Boolean(declineInviteDisabled);
+  const declineInviteActionDisabled =
+    declineInviteBusy ||
+    acceptInviteBusy ||
+    declineInviteDisabledProp ||
+    isArchived ||
+    isCancelled;
+  const declineInviteButtonLabel =
+    declineInviteLabel ||
+    (declineInviteBusy
+      ? "Declining invite..."
+      : "Can't make it? Decline invite");
 
   const handleManageInvites = useCallback(() => {
     if (!canManageInvites || !matchId) return;
@@ -1270,7 +1298,9 @@ const MatchDetailsModal = ({
   };
 
   const joinDisabledReason = () => {
-    if (!isOpenMatch) return "Private matches require an invite.";
+    if (!isOpenMatch && !showAcceptInvite) {
+      return "Private matches require an invite.";
+    }
     if (isArchived) return "This match has been archived.";
     if (isCancelled) return "This match has been cancelled.";
     if (!isUpcoming) return "This match is no longer accepting players.";
@@ -1279,7 +1309,8 @@ const MatchDetailsModal = ({
   };
 
   const handleJoin = async () => {
-    if (!match?.id) return;
+    const matchIdValue = match?.id;
+    if (!matchIdValue) return;
     if (!currentUser) {
       onRequireSignIn?.();
       return;
@@ -1289,13 +1320,41 @@ const MatchDetailsModal = ({
       onToast?.(reason, "error");
       return;
     }
+    if (showAcceptInvite) {
+      if (acceptInviteActionDisabled) return;
+      try {
+        const result = await onAcceptInvite(match);
+        setStatus("success");
+        await onMatchRefresh?.();
+        if (result && onUpdateMatch) {
+          onUpdateMatch(result);
+        } else if (onReloadMatch && onUpdateMatch) {
+          const updated = await onReloadMatch(matchIdValue, {
+            includeArchived: false,
+          });
+          if (updated) {
+            onUpdateMatch(updated);
+          }
+        }
+      } catch (error) {
+        if (!error?.silent) {
+          const message =
+            error?.response?.data?.message ||
+            error?.data?.message ||
+            error?.message ||
+            "We couldn't accept this invite. Try again later.";
+          onToast?.(message, "error");
+        }
+      }
+      return;
+    }
     try {
       setJoining(true);
-      await joinMatch(match.id);
+      await joinMatch(matchIdValue);
       setStatus("success");
       await onMatchRefresh?.();
       if (onReloadMatch && onUpdateMatch) {
-        const updated = await onReloadMatch(match.id, { includeArchived: false });
+        const updated = await onReloadMatch(matchIdValue, { includeArchived: false });
         if (updated) {
           onUpdateMatch(updated);
         }
@@ -1683,6 +1742,17 @@ const MatchDetailsModal = ({
 
   const renderDefaultView = () => {
     const disabledReason = joinDisabledReason();
+    const joinButtonDisabled =
+      status !== "details" ||
+      !!disabledReason ||
+      (showAcceptInvite ? acceptInviteActionDisabled : joining);
+    const joinButtonLabel = (() => {
+      if (showAcceptInvite) {
+        if (acceptInviteBusy) return "Accepting invite...";
+        return acceptInviteLabel || "Accept invite";
+      }
+      return joining ? "Joining match..." : "Join this match";
+    })();
     return (
       <div className="flex flex-col">
         <div className="flex flex-col gap-4 border-b border-gray-100 pb-5">
@@ -1932,21 +2002,38 @@ const MatchDetailsModal = ({
               <button
                 type="button"
                 onClick={handleJoin}
-                disabled={joining || !!disabledReason || status !== "details"}
+                disabled={joinButtonDisabled}
                 className="flex w-full items-center justify-center gap-2 rounded-2xl bg-gradient-to-r from-emerald-500 to-green-500 px-6 py-3 text-sm font-black text-white shadow-lg transition-all hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50"
               >
-                {joining ? "Joining match..." : "Join this match"}
+                {joinButtonLabel}
               </button>
               {status === "details" && disabledReason && (
                 <p className="mt-2 text-center text-xs font-semibold text-gray-500">{disabledReason}</p>
               )}
-              {remainingSpots !== null && (
-                <p className="mt-2 text-center text-xs font-semibold text-gray-500">
-                  {remainingSpots} spot{remainingSpots === 1 ? "" : "s"} remaining
-                </p>
-              )}
-            </>
-          )}
+                {remainingSpots !== null && (
+                  <p className="mt-2 text-center text-xs font-semibold text-gray-500">
+                    {remainingSpots} spot{remainingSpots === 1 ? "" : "s"} remaining
+                  </p>
+                )}
+                {showDeclineInvite && (
+                  <>
+                    <button
+                      type="button"
+                      onClick={onDeclineInvite}
+                      disabled={declineInviteActionDisabled}
+                      className="mt-3 inline-flex w-full items-center justify-center gap-2 rounded-2xl border border-slate-200 bg-white px-6 py-3 text-sm font-semibold text-slate-600 transition hover:bg-slate-50 focus:outline-none focus:ring-4 focus:ring-slate-200 disabled:cursor-not-allowed disabled:opacity-60"
+                    >
+                      {declineInviteButtonLabel}
+                    </button>
+                    {declineInviteHelpText && (
+                      <p className="mt-2 text-center text-xs font-semibold text-slate-500">
+                        {declineInviteHelpText}
+                      </p>
+                    )}
+                  </>
+                )}
+              </>
+            )}
         </div>
       </div>
     );