[data-notice] { display: flex !important; align-items: flex-start; gap: 10px; padding: 12px 14px; margin: 12px 0 16px !important; border-radius: 10px; font-size: .875rem; line-height: 1.45; overflow-wrap: anywhere; }
[data-notice="success"] { color: #17633d !important; background: #eaf7ef; border: 1px solid #c6e8d3; }
[data-notice="error"] { color: #a22432 !important; background: #fff0f1; border: 1px solid #f0ccd0; }
[data-notice]::before { content: ''; flex: 0 0 20px; height: 20px; background: currentColor; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m7 12 3 3 7-7' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat; }
[data-notice="error"]::before { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M12 7v6m0 3v1' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E"); }