/* Extracted from index.php */
.px,.px-ov{--px-ink:#0B1D35;--px-ink2:#172C50;--px-gold:#C8963E;--px-mut:#7B8BA8;--px-line:#E3E8F2;--px-fill:#F5F7FB}
.px{
  min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;
  padding:max(20px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom));
  background:#EDF1F8;position:relative;overflow:hidden}
.px::before,.px::after{content:"";position:absolute;border-radius:50%;pointer-events:none;filter:blur(70px)}
.px::before{width:440px;height:440px;top:-160px;left:-140px;background:rgba(217,169,78,.38)}
.px::after{width:460px;height:460px;bottom:-190px;right:-150px;background:rgba(26,86,219,.22)}
.px-card{position:relative;z-index:1;width:100%;max-width:420px;background:#fff;border-radius:28px;
  padding:30px 22px 24px;box-shadow:0 30px 70px rgba(11,29,53,.16),0 2px 8px rgba(11,29,53,.05)}
.px-emb{width:60px;height:60px;margin:0 auto 22px;border-radius:19px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,var(--px-ink),var(--px-ink2));box-shadow:0 12px 28px rgba(11,29,53,.28)}
.px-emb svg{width:28px;height:28px;stroke:#EAC06E;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.px-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--px-fill);border-radius:16px;margin-bottom:22px}
.px-tab{padding:13px 8px;text-align:center;font-size:14px;font-weight:700;color:var(--px-mut);border-radius:12px;cursor:pointer;transition:.2s;user-select:none;-webkit-user-select:none}
.px-tab.on{background:#fff;color:var(--px-ink);box-shadow:0 3px 10px rgba(11,29,53,.1)}
.px-f{margin-bottom:12px}
.px-w{position:relative}
.px-i{width:100%;height:54px;padding:0 16px;border:1.5px solid transparent;border-radius:15px;background:var(--px-fill);
  font:500 16px 'Plus Jakarta Sans',sans-serif;color:var(--px-ink);outline:none;transition:.18s;-webkit-appearance:none;appearance:none}
.px-i::placeholder{color:#A3AEC4;font-weight:400}
.px-i:focus{background:#fff;border-color:var(--px-ink);box-shadow:0 0 0 4px rgba(11,29,53,.07)}
.px-w .px-i{padding-left:46px}
.px-w>svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;stroke:#9AA7C0;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.px-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:12px}
.px-eye svg{width:20px;height:20px;stroke:#9AA7C0;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.px-w .px-i.has-eye{padding-right:50px}
select.px-i{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238B9FC0' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.px-lab{display:block;font-size:12px;font-weight:700;color:#5B6B88;margin:0 0 7px 2px;letter-spacing:.2px}
.px-btn{width:100%;height:56px;margin-top:6px;border:none;border-radius:16px;cursor:pointer;color:#fff;font:700 16px 'Plus Jakarta Sans',sans-serif;
  background:linear-gradient(135deg,var(--px-ink),var(--px-ink2));box-shadow:0 10px 24px rgba(11,29,53,.28);transition:.2s}
.px-btn:active{transform:scale(.985)}
.px-btn:disabled{opacity:.65}
.px-btn.gold{background:linear-gradient(135deg,var(--px-gold),#D9A94E);color:var(--px-ink);box-shadow:0 10px 24px rgba(200,150,62,.38)}
.px-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.px-msg{display:none;margin-top:14px;padding:12px 14px;border-radius:14px;font-size:13px;font-weight:600;line-height:1.5}
.px-terms{text-align:center;font-size:11px;color:var(--px-mut);margin-top:14px}
.px-terms a{color:var(--px-ink);font-weight:700}
/* learner picker row */
.px-lrn{width:100%;display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px dashed #C3CCE0;border-radius:15px;background:var(--px-fill);text-align:left;cursor:pointer;transition:.18s;margin-bottom:12px}
.px-lrn.set{border-style:solid;border-color:rgba(10,124,90,.35);background:#F0FAF5}
.px-lrn.err{border-color:#B91C1C;background:#FEF3F2}
.px-lrn-ico{width:40px;height:40px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 6px rgba(11,29,53,.08)}
.px-lrn-ico svg{width:20px;height:20px;stroke:var(--px-ink);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.px-lrn-t{font-size:14px;font-weight:700;color:var(--px-ink)}
.px-lrn-s{font-size:12px;color:var(--px-mut);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:210px}
.px-lrn-go{margin-left:auto;font-size:20px;color:#9AA7C0;line-height:1}
/* level chips inside learner rows */
.px-lv{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}
.px-lvb{height:38px;border-radius:11px;border:1px solid var(--px-line);background:#fff;font:400 13px 'Plus Jakarta Sans',sans-serif;color:var(--px-mut);cursor:pointer}
.px-lvb.on{background:var(--px-ink);border-color:var(--px-ink);color:#fff}
/* bottom sheet (phones) / modal (larger screens) */
.px-ov{position:fixed;inset:0;z-index:900;background:rgba(11,29,53,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.px-ov.open{opacity:1;visibility:visible}
.px-sheet{position:fixed;z-index:901;left:0;right:0;bottom:0;max-height:90vh;max-height:90dvh;display:flex;flex-direction:column;
  background:#fff;border-radius:26px 26px 0 0;transform:translateY(105%);transition:transform .32s cubic-bezier(.2,.8,.2,1);
  padding-bottom:env(safe-area-inset-bottom,0px);box-shadow:0 -20px 60px rgba(11,29,53,.25)}
.px-ov.open .px-sheet{transform:translateY(0)}
.px-grab{width:42px;height:5px;border-radius:99px;background:#D5DCEA;margin:10px auto 2px;flex-shrink:0}
.px-sh-h{display:flex;align-items:center;justify-content:space-between;padding:12px 20px 10px;flex-shrink:0}
.px-sh-t{font-size:19px;font-weight:800;color:var(--px-ink)}
.px-x{width:38px;height:38px;border-radius:50%;background:var(--px-fill);color:#5B6B88;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center}
.px-sh-b{padding:4px 20px 8px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.px-sh-f{padding:10px 20px 18px;flex-shrink:0}
.px-lc{background:var(--px-fill);border-radius:18px;padding:14px;margin-bottom:12px}
.px-lc-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.px-lc-n{font-size:12px;font-weight:800;color:var(--px-ink);letter-spacing:.4px;text-transform:uppercase}
.px-lc-rm{font-size:12px;font-weight:700;color:#B91C1C;padding:6px 10px;border-radius:10px;background:#FEF0EE}
.px-lc .px-i{background:#fff}
.px-add{width:100%;height:50px;border-radius:15px;border:1.5px solid var(--px-ink);color:var(--px-ink);background:#fff;font:700 14px 'Plus Jakarta Sans',sans-serif;cursor:pointer;margin-bottom:6px}
.px-staff{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));z-index:2;width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;opacity:.35;transition:.2s}
.px-staff:hover{opacity:.9}
.px-staff svg{width:18px;height:18px;stroke:var(--px-ink);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* minimalist: no bold on the sign-in / sign-up pages */
.px *,.px-ov *,#termsOverlay *{font-weight:400 !important}
/* smaller learner popup on phones */
@media(max-width:599px){
  .px-sheet{max-height:72vh;max-height:72dvh;border-radius:20px 20px 0 0}
  .px-grab{margin:8px auto 0}
  .px-sh-h{padding:8px 16px 6px}
  .px-sh-t{font-size:16px}
  .px-x{width:32px;height:32px;font-size:20px}
  .px-sh-b{padding:2px 16px 6px}
  .px-lc{padding:10px;margin-bottom:8px;border-radius:14px}
  .px-lc-h{margin-bottom:6px}
  .px-sheet .px-i{height:44px;font-size:16px;border-radius:12px}
  .px-lab{margin-bottom:5px}
  .px-lc .px-f{margin-bottom:8px}
  .px-add{height:42px;font-size:13px}
  .px-sh-f{padding:6px 16px 12px}
  .px-sh-f .px-btn{height:46px;font-size:15px;border-radius:13px}
}
@media(min-width:600px){
  .px-card{padding:38px 34px 30px;max-width:440px}
  .px-sheet{left:50%;right:auto;bottom:auto;top:50%;width:440px;max-height:86vh;border-radius:26px;transform:translate(-50%,-46%);opacity:0;transition:transform .28s,opacity .28s;padding-bottom:0}
  .px-ov.open .px-sheet{transform:translate(-50%,-50%);opacity:1}
  .px-grab{display:none}
}
