.membership-notice{display:flex;align-items:center;gap:13px;min-width:0;margin:0 0 22px;padding:13px 17px;border:1px solid #eadfc7;border-radius:11px;background:#fffcf5;color:#6e644d}
.membership-notice *,.membership-reminder-dialog *{box-sizing:border-box}
.membership-notice svg,.membership-reminder-dialog svg{width:20px;height:20px;flex:none}
.membership-notice-mark{display:grid;place-items:center;flex:none;width:32px;height:32px;border:1px solid #ede3cb;border-radius:9px;background:#fbf5e7;color:#a28c55}
.membership-notice-mark svg{width:17px;height:17px}
.membership-notice-copy{flex:1;min-width:0}
.membership-notice-copy strong{display:block;font-size:12px;font-weight:600;line-height:1.7;color:#7f6e45}
.membership-notice-copy p{margin:4px 0 0;font-size:11px;line-height:1.8;color:#9b927c;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.membership-notice-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.membership-notice .membership-notice-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:7px;font:inherit;font-size:11px;font-weight:500;line-height:1.6;padding:10px 12px;white-space:nowrap;cursor:pointer}
.membership-notice .membership-notice-renew{background:#8d7b50;color:#fff;border:1px solid #8d7b50}
.membership-notice .membership-notice-renew:hover{background:#78673e}
.membership-notice .membership-notice-plans{background:#fffdf8;color:#8b7d59;border:1px solid #e9dfca}
.membership-notice .membership-notice-support{background:transparent;color:#9b9072;border:0;padding-inline:7px}
.membership-notice[data-status=expired]{background:#fcf8f1;border-color:#eadcc3}
.membership-reminder-dialog{padding:8px 5px 0;min-width:0;color:#3b5042}
.membership-reminder-mark{display:grid;place-items:center;width:58px;height:58px;margin:0 0 21px;border:1px solid #e8dfc7;border-radius:17px;background:#faf6e9;color:#a08a54}
.membership-reminder-mark svg{width:28px;height:28px;stroke-width:1.25}
.membership-reminder-dialog h3{margin:0 0 11px;color:#4c5943;font-size:23px;font-weight:600;line-height:1.6}
.membership-reminder-meta{font-size:11px;color:#9c947c;line-height:1.8;margin:0 0 19px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.membership-reminder-description{font-size:12px;line-height:1.9;color:#8b9381;margin:0 0 25px;overflow-wrap:anywhere}
.membership-reminder-actions{display:flex;flex-wrap:wrap;gap:9px}
.membership-reminder-dialog .membership-reminder-actions button{min-height:44px;border-radius:8px;font:inherit;font-size:12px;line-height:1.6;padding:11px 17px;cursor:pointer}
.membership-reminder-dialog .membership-reminder-actions .primary{background:#248264;color:#fff}
.membership-reminder-dialog .membership-reminder-actions .secondary{background:#fff;border:1px solid #e0e7dd;color:#69805e}
.membership-reminder-dialog .membership-reminder-later{background:transparent;color:#8e9888;border:0;font-weight:400}
.membership-reminder-dialog .membership-reminder-support{display:inline-flex;align-items:center;min-height:44px;margin:7px 0 0;padding:8px 0;background:transparent;border:0;border-radius:5px;color:#8e9d83;font:inherit;font-size:11px;line-height:1.6;cursor:pointer}
#modal:has(.membership-reminder-dialog) #close-modal{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:0;border-radius:8px;background:transparent;color:#8d9a84;font-size:24px}
.membership-notice button:focus-visible,.membership-reminder-dialog button:focus-visible{outline:2px solid #248264;outline-offset:3px}
@media(max-width:1100px){.membership-notice{align-items:flex-start;flex-wrap:wrap}.membership-notice-actions{margin-left:45px}.membership-notice-copy{flex-basis:calc(100% - 45px)}}
@media(max-width:480px){.membership-notice{padding:15px 16px;gap:10px;margin-bottom:18px;border-radius:10px}.membership-notice-mark{width:29px;height:29px;border-radius:8px}.membership-notice-copy{flex-basis:calc(100% - 39px)}.membership-notice-copy strong{font-size:12px}.membership-notice-copy p{font-size:10px}.membership-notice-actions{margin-left:0;width:100%;gap:5px}.membership-notice .membership-notice-actions button{font-size:11px;padding:9px 11px;flex:1}.membership-notice .membership-notice-support{padding-inline:3px}.membership-reminder-dialog{padding:4px 0 0}.membership-reminder-dialog h3{font-size:21px}.membership-reminder-actions{gap:8px}.membership-reminder-dialog .membership-reminder-actions button{padding:10px 13px;flex:1}.membership-reminder-dialog .membership-reminder-actions .membership-reminder-later{flex-basis:100%}.membership-reminder-dialog .membership-reminder-support{margin-top:0}}
