.jp-alert{box-sizing:border-box;width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #e1eae6;border-radius:20px;background:#fff;color:#17365d;font:14px/1.7 'Noto Sans Thai',sans-serif;overflow:auto;box-shadow:0 24px 80px #102c4b33}
.jp-alert::backdrop{background:#102c4b85;backdrop-filter:blur(3px)}
.jp-alert *{box-sizing:border-box}
.jp-alert__card{padding:28px}
.jp-alert__icon{display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:#eaf2ff;color:#2766c3;font-size:27px;font-weight:700;margin-bottom:16px}
.jp-alert--success .jp-alert__icon{background:#e7f6ef;color:#168060}
.jp-alert--warning .jp-alert__icon{background:#fff3db;color:#a26a12}
.jp-alert--error .jp-alert__icon{background:#fff0ef;color:#b33a35}
.jp-alert__title{font-size:21px;line-height:1.4;margin:0 0 12px}
.jp-alert__message{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:#526375;max-height:42dvh;overflow:auto}
.jp-alert__label{display:block;margin:16px 0 6px;font-weight:600}
.jp-alert__input{width:100%;min-height:44px;border:1px solid #b8cfc5;border-radius:10px;padding:10px 12px;font:inherit;color:inherit;background:#fff}
.jp-alert__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}
.jp-alert__button{min-height:44px;padding:10px 20px;border-radius:10px;font:inherit;font-weight:600;cursor:pointer}
.jp-alert__button--primary{border:1px solid #168060;background:#168060;color:#fff}
.jp-alert__button--secondary{border:1px solid #dce5e1;background:#fff;color:#526375}
.jp-alert--error .jp-alert__button--primary{border-color:#b33a35;background:#b33a35}
.jp-alert__button:focus-visible,.jp-alert__input:focus-visible{outline:3px solid #8ac6b1;outline-offset:3px}
.jp-feedback:not(:empty){padding:12px 14px;border-radius:10px;background:#edf4ff;color:#17365d;font-size:13px;line-height:1.6;margin:12px 0;overflow-wrap:anywhere}
.jp-feedback[data-feedback=success]:not(:empty){background:#e7f6ef;color:#176b51}
.jp-feedback[data-feedback=error]:not(:empty){background:#fff0ef;color:#a33838}
.jp-feedback[data-feedback=warning]:not(:empty){background:#fff3db;color:#865b19}
@media(max-width:480px){.jp-alert__card{padding:22px 18px}.jp-alert__actions{display:grid;grid-template-columns:1fr 1fr}.jp-alert__actions .jp-alert__button:only-child{grid-column:1/-1}.jp-alert__title{font-size:19px}}
@media(prefers-reduced-motion:no-preference){.jp-alert[open]{animation:jp-alert-in .15s ease-out}@keyframes jp-alert-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}

.jp-feedback__action{display:inline-block;margin:10px 8px 0 0;border:1px solid currentColor;border-radius:8px;padding:6px 12px;color:inherit;background:transparent;text-decoration:none;font:inherit;cursor:pointer}

.jp-feedback--panel{grid-column:1/-1;width:100%}