:root {
	--cg-modal-bg: #fff;
	--cg-title-color: #202124;
	--cg-text-color: #5f6368;
	--cg-line-bg: #06c755;
	--cg-line-hover: #05b04b;
	--cg-neutral-bg: #f1f3f4;
	--cg-neutral-hover: #e8eaed;
	--cg-danger-color: #d93025;
}

/* overlay */
.contact-guard-overlay { position: fixed; inset: 0; z-index: 99999; display: none; background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }

/* modal */
.contact-guard-modal { position: absolute; left: 50%; top: 50%; width: 90%; max-width: 360px; padding: 30px 24px; background: var(--cg-modal-bg); border-radius: 16px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15); box-sizing: border-box; text-align: center; transform: translate(-50%, -50%); animation: contactGuardPopIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }

/* text */
.contact-guard-modal h3 { margin: 0 0 12px; font-size: 22px; font-weight: 600; color: var(--cg-title-color); }
.contact-guard-modal p { margin: 0 0 24px; font-size: 15px; line-height: 1.6; color: var(--cg-text-color); }

/* buttons */
.contact-guard-actions { display: flex; flex-direction: column; gap: 12px; }
.contact-guard-btn { display: block; width: 100%; padding: 14px 15px; border: 0; border-radius: 10px; box-sizing: border-box; font-size: 16px; font-weight: 500; text-align: center; text-decoration: none; cursor: pointer; transition: background-color 0.2s ease, transform 0.2s ease; }
.contact-guard-btn:active { transform: scale(0.97); }

/* LINE */
.contact-guard-line { background: var(--cg-line-bg); color: #fff; }
.contact-guard-line:hover { background: var(--cg-line-hover); }

/* stay */
.contact-guard-stay { background: var(--cg-neutral-bg); color: var(--cg-title-color); }
.contact-guard-stay:hover { background: var(--cg-neutral-hover); }

/* leave */
.contact-guard-leave { background: transparent; color: var(--cg-danger-color); }
.contact-guard-leave:hover { background: #fce8e6; }

/* animation */
@keyframes contactGuardPopIn { from { opacity: 0; transform: translate(-50%, -45%) scale(0.95); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
