.ui-dialog { position: fixed; inset: 0; z-index: 9999; display: none; }
.ui-dialog.is-open { display: block; }

.ui-dialog__backdrop {
    position: absolute; inset: 0;
    background: rgba(0,0,0,.55);
    backdrop-filter: blur(2px);
}

.ui-dialog__panel {
    position: relative;
    width: min(520px, calc(100% - 32px));
    margin: 12vh auto 0;
    background: #111;
    color: #fff;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0,0,0,.55);
    overflow: hidden;
}
.ui-dialog { position: fixed; inset: 0; z-index: 200000; display: none; }
.ui-dialog__header { display:flex; align-items:center; justify-content:space-between; padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,.10); }
.ui-dialog__title { margin: 0; font-size: 16px; font-weight: 700; letter-spacing: -0.2px; }
.ui-dialog__x {
    width: 36px; height: 36px; border: 0; background: transparent; color: rgba(255,255,255,.8);
    font-size: 22px; cursor: pointer; border-radius: 10px;
}
.ui-dialog__x:hover { background: rgba(255,255,255,.08); }

.ui-dialog__body { padding: 16px; }
.ui-dialog__message { margin: 0; white-space: pre-line; line-height: 1.6; color: rgba(255,255,255,.92); }

.ui-dialog__footer { display:flex; gap: 10px; justify-content:flex-end; padding: 14px 16px; border-top: 1px solid rgba(255,255,255,.10); }

.ui-dialog__btn {
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
    font-weight: 600;
}
.ui-dialog__btn:hover { background: rgba(255,255,255,.10); }

.ui-dialog__btn--ok { background: rgba(99,102,241,.22); border-color: rgba(99,102,241,.45); }
.ui-dialog__btn--ok:hover { background: rgba(99,102,241,.30); }

.ui-dialog__btn--danger { background: rgba(239,68,68,.20); border-color: rgba(239,68,68,.45); }
.ui-dialog__btn--danger:hover { background: rgba(239,68,68,.28); }

.ui-dialog__btn[disabled] { opacity: .6; cursor: not-allowed; }