.guest-trial-notice { position: fixed; right: 22px; bottom: 22px; z-index: 120; display: flex; align-items: center; gap: 18px; max-width: min(460px, calc(100vw - 32px)); padding: 14px 16px; border: 1px solid color-mix(in srgb, #d89b45 55%, var(--border-color, #dfe4ea)); border-radius: 10px; color: var(--text-primary, #18202b); background: var(--surface-primary, #fff); box-shadow: 0 16px 38px rgba(16, 28, 42, .2); opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.guest-trial-notice.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.guest-trial-notice > div { display: grid; gap: 3px; }
.guest-trial-notice strong { font-size: .9rem; }
.guest-trial-notice span { color: var(--text-secondary, #66707d); font-size: .78rem; line-height: 1.5; }
.guest-trial-notice a { flex: 0 0 auto; border-radius: 7px; padding: 9px 11px; color: #fff; background: var(--accent-color, #315f88); font-size: .8rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.guest-trial-notice a span { color: inherit; font-size: 1rem; }
@media (max-width: 560px) { .guest-trial-notice { right: 12px; bottom: 12px; left: 12px; gap: 10px; } .guest-trial-notice a { padding: 8px 9px; } }