body.safari-guide-open { overflow: hidden; }
.safari-guide { position: fixed; top: 0; left: 0; width: 100dvw; height: 100dvh; z-index: 9999; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; }
.safari-guide[hidden] { display: none; }
.safari-guide-shell { position: absolute; inset: 0; background: rgba(15, 23, 18, 0.55); backdrop-filter: blur(4px); display: flex; align-items: flex-start; justify-content: center; padding: 76px 20px 24px; overflow-y: auto; box-sizing: border-box; }
.safari-corner-target { position: fixed; top: 26px; right: 30px; width: 44px; height: 44px; border-radius: 12px; background: #173f2b; color: #b6f23a; font-size: 22px; font-weight: 700; display: grid; place-items: center; line-height: 1; padding-bottom: 10px; box-shadow: 0 8px 20px rgba(23,63,43,0.35); animation: safari-target-pulse 1.7s ease-in-out infinite; z-index: 10000; }
.safari-corner-hint { position: fixed; top: 82px; right: 18px; background: #173f2b; color: #fff; font-size: 12px; padding: 4px 10px; border-radius: 999px; z-index: 10000; white-space: nowrap; }
.safari-guide-arrow { position: fixed; top: 116px; right: 52px; width: 2px; height: 110px; background: linear-gradient(to bottom, #b6f23a, transparent); z-index: 10000; }
.safari-guide-arrow::after { content: ""; position: absolute; top: -8px; left: -5px; border: 6px solid transparent; border-bottom-color: #b6f23a; }
.safari-guide-card { position: relative; width: 100%; max-width: min(380px, 88vw); box-sizing: border-box; background: #ffffff; border-radius: 24px; padding: 28px 24px 24px; box-shadow: 0 24px 60px rgba(0,0,0,0.25); text-align: center; }
.safari-compass { width: 56px; height: 56px; margin: 0 auto 14px; border-radius: 14px; background: #eef4ef; position: relative; }
.safari-compass::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; border: 2px solid #173f2b; }
.safari-compass::after { content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 22px; margin: -11px 0 0 -5px; background: linear-gradient(to top, #173f2b 50%, #b6f23a 50%); clip-path: polygon(50% 0, 100% 55%, 50% 100%, 0 55%); }
.safari-guide-card h2 { margin: 0 0 6px; font-size: 19px; font-weight: 700; color: #111813; }
.safari-guide-subtitle { margin: 0 0 16px; font-size: 13px; color: #5c6a60; }
.safari-guide-steps { margin: 0 0 18px; padding: 0; list-style: none; text-align: left; display: grid; gap: 10px; }
.safari-guide-steps li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #243528; }
.safari-step-number { flex: none; width: 22px; height: 22px; border-radius: 50%; background: #173f2b; color: #b6f23a; font-size: 12px; font-weight: 700; display: grid; place-items: center; }
.safari-guide-status { font-size: 12px; line-height: 1.5; color: #5c6a60; margin: 0 0 12px; }
.safari-link-fallback { width: 100%; padding: 10px; border: 1px solid #ccd6cf; border-radius: 8px; margin-bottom: 12px; font-size: 16px; }
.safari-open-button:disabled { opacity: 0.55; cursor: default; }
.safari-guide-actions { display: grid; gap: 9px; }
.safari-open-button, .safari-copy-button, .safari-continue-button { border: 0; border-radius: 14px; padding: 13px 16px; font-size: 14px; font-weight: 600; cursor: pointer; }
.safari-open-button { background: #173f2b; color: #b6f23a; }
.safari-copy-button { background: #eef4ef; color: #173f2b; }
.safari-continue-button { background: transparent; color: #8a968c; font-weight: 500; }
@keyframes safari-target-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.safari-diagnostics { position: fixed; bottom: 8px; left: 8px; right: 8px; z-index: 10002; max-height: 40vh; overflow: auto; padding: 12px; background: #fff; color: #17241b; border: 1px solid #66806d; border-radius: 10px; font: 12px/1.5 monospace; }
.safari-diagnostics pre { white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 8px; }