body.modal-open{overflow:hidden}
.modal-overlay{position:fixed!important;inset:0!important;z-index:1000!important;display:grid!important;place-items:center!important;padding:28px!important;background:rgba(32,25,38,.42)!important;backdrop-filter:blur(16px) saturate(.86)!important;-webkit-backdrop-filter:blur(16px) saturate(.86)!important;opacity:0;pointer-events:none;transition:opacity .24s ease}
.modal-overlay.open{opacity:1;pointer-events:auto}
.app-modal{position:relative;width:min(580px,calc(100vw - 40px));max-height:min(760px,calc(100vh - 56px));overflow:auto;padding:34px;border:1px solid rgba(105,73,190,.16);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(248,245,251,.97));box-shadow:0 40px 120px rgba(30,20,42,.32),0 8px 28px rgba(30,20,42,.14),inset 0 1px #fff;transform:translateY(24px) scale(.96);opacity:0;transition:transform .34s cubic-bezier(.2,.9,.2,1),opacity .24s}
.modal-overlay.open .app-modal{transform:none;opacity:1}
.modal-close{right:18px;top:18px;width:38px;height:38px;border:1px solid rgba(55,44,64,.07);border-radius:12px;background:rgba(238,234,242,.82);color:#716976;font-size:20px;transition:transform .2s,background .2s,color .2s}.modal-close:hover{transform:rotate(4deg);background:#e9e1f7;color:#613fb9}
.modal-icon{width:46px;height:46px;margin-bottom:20px;border:1px solid rgba(103,70,191,.12);border-radius:14px;background:linear-gradient(145deg,#eee7ff,#e2d6fb);color:#6745be;font-size:13px;box-shadow:0 10px 28px rgba(92,58,178,.12),inset 0 1px #fff}
.app-modal h2{margin:0 52px 12px 0;font-size:24px;letter-spacing:-.8px;color:#2d282f}.modal-content{font-size:14px;line-height:1.75;color:#706873}.modal-content p{margin-bottom:15px}
.modal-content .modal-list{gap:10px;margin-top:20px}.modal-content .modal-row{min-height:64px;padding:14px 16px;border:1px solid rgba(70,55,82,.09);border-radius:14px;background:rgba(255,255,255,.72);box-shadow:0 7px 22px rgba(50,37,64,.045),inset 0 1px #fff;transition:transform .22s,border-color .22s,box-shadow .22s}.modal-content .modal-row:hover{transform:translateY(-2px);border-color:rgba(103,70,191,.2);box-shadow:0 13px 30px rgba(50,37,64,.08)}.modal-content .modal-row b{font-size:14px;color:#38313d}.modal-content .modal-row span{font-size:12px;color:#8a818d}
.modal-actions{gap:10px;margin-top:28px}.modal-actions button{min-width:96px;height:44px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:600}.modal-actions .modal-secondary{border-color:rgba(60,48,70,.1);background:#f4f1f6;color:#5f5862}.modal-actions .modal-primary{border:0;background:linear-gradient(135deg,#7f5cda,#633fbf);box-shadow:0 12px 28px rgba(91,55,181,.24);color:#fff}.modal-actions .modal-primary:hover{box-shadow:0 17px 36px rgba(91,55,181,.32);transform:translateY(-2px)}
.notification-item{padding:14px 2px}.notification-item b{font-size:13px}.notification-item small{font-size:11px}.account-card{padding:15px;border-radius:14px}.account-card>span{width:46px;height:46px}.account-card b{font-size:14px}.account-card small{font-size:11px}
@media(max-width:620px){.modal-overlay{padding:16px!important;align-items:end!important}.app-modal{width:100%;max-height:calc(100vh - 32px);padding:26px 22px;border-radius:22px}.app-modal h2{font-size:21px}.modal-content .modal-row{align-items:flex-start;gap:8px;flex-direction:column}.modal-actions{display:grid;grid-template-columns:1fr 1fr}.modal-actions button{width:100%}}
