.my-posts-page { position:fixed; top:0; bottom:0; left:50%; -webkit-transform:translateX(-50%); transform:translateX(-50%); width:100%; max-width:488px; z-index:110; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; background:#f5f3ff; color:#302644; }
.my-posts-page .invite-topbar { background:#fff; border-bottom:1px solid #ece7f4; }
.my-posts-page .invite-page-title { color:#302644; font-size:16px; font-weight:600; }
.my-posts-page .invite-back-btn { color:#8b48dd; }
.mp-content { padding:14px 13px 24px; padding-bottom:calc(24px + constant(safe-area-inset-bottom)); padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
.my-posts-page .user-auth-active-bg { width:25%; }
.my-posts-page .user-auth-tab { -webkit-flex-basis:25%; flex-basis:25%; }
.mp-card { padding:15px; margin-bottom:12px; border:1px solid #eee7f7; border-radius:13px; background:#fff; }
.mp-heading { display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-align:start; -webkit-align-items:flex-start; align-items:flex-start; }
.mp-title { -webkit-box-flex:1; -webkit-flex:1; flex:1; min-width:0; margin-right:9px; color:#35294b; font-size:14px; font-weight:600; line-height:1.6; word-break:break-word; overflow-wrap:break-word; }
.mp-status { padding:2px 7px; border-radius:5px; font-size:10px; white-space:nowrap; }
.mp-status-0 { color:#ab7d24; background:#fff8e8; }
.mp-status-1 { color:#399274; background:#edf9f3; }
.mp-status-2 { color:#d25c67; background:#fff0f1; }
.mp-meta { margin-top:9px; color:#a89eaf; font-size:10px; line-height:1.8; word-break:break-word; }
.mp-meta span { display:inline-block; margin-right:10px; }
.mp-reason { margin:10px 0 0; padding:9px; border-radius:6px; background:#fff4f5; color:#ba6872; font-size:11px; line-height:1.7; word-break:break-word; }
.mp-footer { display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-pack:justify; -webkit-justify-content:space-between; justify-content:space-between; margin-top:12px; padding-top:10px; border-top:1px solid #f1edf6; font-size:11px; }
.mp-footer a { color:#9566b9; }
.mp-footer span { color:#aaa0b1; font-size:10px; }
.mp-footer button { padding:0; border:0; background:transparent; color:#d65c69; font-size:11px; }
.mp-state { padding:35px 12px; color:#a89eaf; text-align:center; font-size:12px; line-height:2; }
.mp-state button { margin-top:10px; padding:5px 12px; background:#fff; border:1px solid #e8dced; border-radius:6px; color:#9566b9; }
.mp-pager { display:-webkit-box; display:-webkit-flex; display:flex; -webkit-box-align:center; -webkit-align-items:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; justify-content:center; padding:8px 0; font-size:11px; color:#a89eaf; }
.mp-pager button { padding:7px 12px; background:#fff; color:#9566b9; border:1px solid #e7dced; border-radius:7px; font-size:11px; }
.mp-pager span { margin:0 13px; }
.mp-pager button:disabled { opacity:.45; }
.mp-confirm-overlay { position:fixed; top:0; bottom:0; left:0; right:0; z-index:250; background:rgba(39,24,53,.35); }
.mp-confirm { position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); width:calc(100% - 40px); max-width:320px; padding:20px; border-radius:14px; background:#fff; color:#302644; }
.mp-confirm h2 { font-size:16px; font-weight:600; }
.mp-confirm p { margin:12px 0 18px; color:#97819f; font-size:12px; line-height:1.8; }
.mp-confirm .mp-delete-error { color:#d65c69; margin:0 0 12px; }
.mp-confirm-actions { display:-webkit-box; display:-webkit-flex; display:flex; }
.mp-confirm-actions button { -webkit-box-flex:1; -webkit-flex:1; flex:1; padding:10px 4px; border:0; border-radius:8px; background:#f3edf9; color:#9566b9; font-size:12px; }
.mp-confirm-actions button + button { margin-left:10px; background:#a855f7; color:#fff; }
