.app-feedback-stack { position: fixed; right: 1rem; bottom: 1rem; display: flex; flex-direction: column; gap: 0.75rem; width: min(24rem, calc(100vw - 2rem)); z-index: 2100; pointer-events: none; } .app-feedback { pointer-events: auto; display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.9rem 1rem; border-radius: 12px; border: 1px solid var(--border-primary); background: var(--bg-secondary); box-shadow: 0 16px 32px rgba(0, 0, 0, 0.24); color: var(--text-primary); backdrop-filter: blur(10px); } .app-feedback-info { border-color: var(--accent); background: color-mix(in srgb, var(--bg-secondary) 82%, var(--accent-bg)); } .app-feedback-success { border-color: var(--success); background: color-mix(in srgb, var(--bg-secondary) 82%, var(--success-bg)); } .app-feedback-warning { border-color: var(--warning); background: color-mix(in srgb, var(--bg-secondary) 82%, var(--warning-bg)); } .app-feedback-error { border-color: var(--danger); background: color-mix(in srgb, var(--bg-secondary) 82%, var(--danger-bg)); } .app-feedback-message { flex: 1; font-size: 0.95rem; line-height: 1.45; } .app-feedback-close { padding: 0; border: none; background: transparent; color: inherit; font-size: 1.2rem; line-height: 1; cursor: pointer; opacity: 0.7; } .app-feedback-close:hover { opacity: 1; } @media (max-width: 640px) { .app-feedback-stack { right: 0.75rem; left: 0.75rem; bottom: 0.75rem; width: auto; } }