.body--lock,.mp-code{overflow:hidden;font-family:jpack !important;}@font-face{font-family:jpa;src:url(https://jpa-erp.com/public/fonts/ttf/Far.Casablanca.ttf)}:root{--mp-bg:#0b0f19;--mp-fg:#ffffff;--mp-overlay:rgba(15, 23, 42, 0.55);--mp-radius:18px;--mp-shadow:0 20px 60px rgba(0,0,0,.18);--mp-gap:18px;--mp-accent:#22c55e}.demo-wrap{padding:40px}.demo-wrap .btn-open-modal{height:44px;padding:0 16px;border-radius:12px;border:none;cursor:pointer;font-weight:600;background:#111827;color:#fff}#mp-modal[hidden]{display:none!important}#mp-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center}.mp-modal__overlay{position:absolute;inset:0;background:var(--mp-overlay);opacity:0;transition:opacity .25s}.mp-modal__panel{position:relative;background:#000;color:var(--mp-fg);border-radius:var(--mp-radius);box-shadow:var(--mp-shadow);width:min(100vw,450px);height:min(68vh,320px);overflow:hidden;transform:translateY(12px) scale(.98);opacity:0;transition:transform .28s,opacity .28s}.mp-modal__text,.mp-modal__title{margin:0;color:#000;font-weight:600}#mp-modal.is-open .mp-modal__overlay{opacity:1}#mp-modal.is-open .mp-modal__panel{opacity:1;transform:translateY(0) scale(1)}@media (prefers-reduced-motion:reduce){.mp-modal__overlay,.mp-modal__panel{transition:none}}.mp-modal__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.mp-modal__bgOverlay{position:absolute;inset:0;background:url(https://jpa-erp.com/public/images/top_pattern.png) center/cover no-repeat #fff;pointer-events:none}.mp-modal__contentLayer{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;padding:24px}.mp-codeWrap,.mp-modal__close{display:grid;background:#d3060c}.mp-modal__content{width:min(520px,92%);height:min(290px,85%);display:grid;gap:var(--mp-gap);text-align:center;background:rgba(255,255,255,.5);box-shadow:3px 4px 20px #d4d4d4;backdrop-filter:saturate(120%) blur(6px);border:1px solid #dc143c;border-radius:16px;padding:clamp(16px,3vw,24px);font-family:jpa !important;}.mp-modal__title{font-size:clamp(1.6rem, 3.2vw, 2rem);line-height:1.2}.mp-modal__text{opacity:.92;font-size:16px}.mp-modal__close{position:absolute;top:12px;right:12px;width:30px;height:30px;place-items:center;border:none;border-radius:8px;color:#fff;cursor:pointer;transition:transform .15s,background .15s;z-index:2;font-weight:600}.mp-modal__close:hover{transform:scale(1.05);background:#d3060c}.mp-codeWrap{grid-template-columns:1fr auto;gap:10px;align-items:center;border:1px dashed rgba(255,255,255,.35);border-radius:12px;padding:0 10px}.mp-code{font-variant-numeric:tabular-nums;letter-spacing:.06em;font-weight:700;color:#fff;user-select:text;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,.06);text-overflow:ellipsis;white-space:nowrap;border:2px dashed #fff}.mp-copyBtn{height:40px;padding:0 14px;border-radius:10px;border:none;cursor:pointer;font-weight:700;color:#0b0f19;background:#fff;align-items:center;}.mp-copyBtn:hover{filter:brightness(1.05)}.mp-form__hint{min-height:24px;margin:6px 2px 0;font-size:.95rem;color:#e5e7eb}.mp-form__hint.is-success{color:var(--mp-accent)}