/* ---------- modal pop-ups (WebMaster: Modal manager) ---------- */
.mdl{position:fixed;inset:0;z-index:2500;display:flex;align-items:center;justify-content:center;padding:16px}
.mdl[hidden]{display:none}
.mdl.noov{pointer-events:none}.mdl.noov .mdl-box{pointer-events:auto}
.mdl-ov{position:absolute;inset:0;background:var(--ov);-webkit-backdrop-filter:blur(var(--ovb));backdrop-filter:blur(var(--ovb));animation:mdlfade var(--en) var(--ease) both}
.mdl-p-top{align-items:flex-start}.mdl-p-bottom{align-items:flex-end}.mdl-p-left{justify-content:flex-start}.mdl-p-right{justify-content:flex-end}
.mdl-p-tl{align-items:flex-start;justify-content:flex-start}.mdl-p-tr{align-items:flex-start;justify-content:flex-end}.mdl-p-bl{align-items:flex-end;justify-content:flex-start}.mdl-p-br{align-items:flex-end;justify-content:flex-end}
.mdl-box{position:relative;width:min(var(--w),100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--bg);border-radius:var(--rad);border:var(--bd);box-shadow:var(--sh);outline:0;display:flex;flex-direction:column;animation:var(--fin,mdlin) var(--en) var(--ease) both}
.mdl-tx{padding:var(--pad);display:flex;flex-direction:column;gap:12px;min-width:0;flex:1}
.mdl-t{margin:0;line-height:1.15}.mdl-b{overflow-wrap:anywhere}
.mdl-mw{flex:none;line-height:0}.mdl-mw .mdl-media{width:100%;height:var(--mh);display:block}
.mdl-m-bottom{flex-direction:column-reverse}.mdl-m-left{flex-direction:row}.mdl-m-right{flex-direction:row-reverse}
.mdl-m-left .mdl-mw,.mdl-m-right .mdl-mw{width:42%}.mdl-m-left .mdl-mw .mdl-media,.mdl-m-right .mdl-mw .mdl-media{height:100%;min-height:var(--mh)}
.mdl-m-top .mdl-mw .mdl-media,.mdl-m-bottom .mdl-mw .mdl-media{border-radius:var(--mrad)}
.mdl-bgm{position:absolute;inset:0;z-index:0}.mdl-bgm::after{content:"";position:absolute;inset:0;background:var(--md)}.mdl-bgm .mdl-media{width:100%;height:100%;display:block}
.mdl-m-background .mdl-tx{position:relative;z-index:1;justify-content:center;min-height:var(--mh)}
.mdl-btns{display:flex;flex-wrap:wrap;gap:var(--bgap);margin-top:6px}.mdl-btns.bd-column{flex-direction:column}
.ba-left{justify-content:flex-start}.ba-center{justify-content:center}.ba-right{justify-content:flex-end}.ba-stretch>*{flex:1}.bd-column.ba-center{align-items:center}.bd-column.ba-left{align-items:flex-start}.bd-column.ba-right{align-items:flex-end}.bd-column.ba-stretch{align-items:stretch}
.mdl-btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;text-decoration:none;font-family:inherit;line-height:1.2;transition:filter .2s,transform .2s;max-width:100%}
.mdl-btn.hv-bright:hover{filter:brightness(1.12)}.mdl-btn.hv-dark:hover{filter:brightness(.88)}.mdl-btn.hv-lift:hover{transform:translateY(-2px)}
.mdl-x{position:absolute;top:10px;z-index:3;width:var(--xs);height:var(--xs);border:0;border-radius:50%;background:var(--xbg);color:var(--xc);font:400 calc(var(--xs)*.7)/1 system-ui,sans-serif;cursor:pointer;display:grid;place-items:center;padding:0 0 3px}
.mdl-x-tr{right:10px}.mdl-x-tl{left:10px}.mdl-x:hover{filter:brightness(.92)}
.mdl-prog{position:absolute;left:0;right:0;bottom:0;height:4px;z-index:3;background:rgba(0,0,0,.08)}.mdl-prog i{display:block;height:100%;width:100%;background:var(--prog);transform-origin:left;transform:scaleX(1)}
/* effects */
.fi-fade{--fx:none}.fi-zoom,.fo-zoom{--fz:scale(.8)}
.mdl{--fi-x:none}
.fi-up{--fi-x:translateY(48px)}.fi-down{--fi-x:translateY(-48px)}.fi-left{--fi-x:translateX(-70px)}.fi-right{--fi-x:translateX(70px)}.fi-zoom{--fi-x:scale(.8)}.fi-flip{--fi-x:perspective(900px) rotateX(-70deg)}.fi-bounce{--fi-x:scale(.3)}
.fo-up{--fo-x:translateY(48px)}.fo-down{--fo-x:translateY(-48px)}.fo-left{--fo-x:translateX(-70px)}.fo-right{--fo-x:translateX(70px)}.fo-zoom{--fo-x:scale(.8)}.fo-flip{--fo-x:perspective(900px) rotateX(70deg)}.fo-bounce{--fo-x:scale(.6)}.fo-fade,.fo-none{--fo-x:none}
.mdl.fi-none .mdl-box,.mdl.fi-none .mdl-ov{animation:none}
.mdl.fi-bounce .mdl-box{animation-name:mdlbounce}
.mdl.is-out .mdl-box{animation:mdlout var(--ex) var(--ease) both}.mdl.is-out .mdl-ov{animation:mdlfadeout var(--ex) var(--ease) both}
.mdl.is-out.fo-none .mdl-box,.mdl.is-out.fo-none .mdl-ov{animation:none;opacity:0}
@keyframes mdlin{from{opacity:0;transform:var(--fi-x,none)}to{opacity:1;transform:none}}
@keyframes mdlout{from{opacity:1;transform:none}to{opacity:0;transform:var(--fo-x,none)}}
@keyframes mdlfade{from{opacity:0}to{opacity:1}}@keyframes mdlfadeout{from{opacity:1}to{opacity:0}}
@keyframes mdlbounce{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(.96)}100%{opacity:1;transform:none}}
@keyframes mdlprog{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(max-width:640px){.mdl-m-left,.mdl-m-right{flex-direction:column}.mdl-m-left .mdl-mw,.mdl-m-right .mdl-mw{width:100%}.mdl-m-left .mdl-mw .mdl-media,.mdl-m-right .mdl-mw .mdl-media{height:var(--mh);min-height:0}.mdl-btns.bd-row{flex-direction:column}.mdl-btns.bd-row .mdl-btn{width:100%!important}}
@media(prefers-reduced-motion:reduce){.mdl *{animation-duration:.01ms!important}}
@media print{.mdl{display:none!important}}
