/* หน้าบุคลากร (openPersonnel ใน app.js) + หน้าสมัคร /experts/apply/ · หน้าตาแบบหน้า "MAYDAY บุคลากร" เดิม · ธีมมืดแบบเดียวตาม CI หน้าแรก
   ทุกกฎอยู่ใต้ .px จึงไม่กระทบหน้าอื่นของแอป · ฟอร์มสร้างที่ /personnel-form.js (ใช้ร่วมกันสองหน้า) */
.px{
  --px-ink:#0A0A0A;--px-panel:#141414;--px-panel2:#1C1C1C;--px-field:#101010;
  --px-ivory:#F4F4F2;--px-muted:rgba(244,244,242,.62);--px-subtle:rgba(244,244,242,.4);
  --px-line:rgba(244,244,242,.10);--px-line2:rgba(244,244,242,.18);--px-line-gold:rgba(242,190,0,.4);
  --px-gold:#F2BE00;--px-gold-deep:#C99A00;--px-gold-soft:rgba(242,190,0,.12);--px-danger:#FF5A47;
  --px-th:'Kanit','Montserrat',system-ui,sans-serif;--px-en:'Montserrat','Kanit',system-ui,sans-serif;
  --px-e:cubic-bezier(.2,.8,.2,1);
  background:var(--px-ink);color:var(--px-ivory);font:300 15px/1.6 var(--px-th);color-scheme:dark;-webkit-font-smoothing:antialiased
}
/* หน้าบุคลากรในแอปศูนย์ = dialog เต็มจอ · หน้าสมัคร /experts/apply/ = <main class="px px-page"> (body.px-body) */
dialog.px{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0}
dialog.px:not([open]){display:none}
dialog.px::backdrop{background:#0A0A0A}
.px-body{margin:0;background:#0A0A0A}
.px-page{min-height:100vh;min-height:100dvh}
.px *{box-sizing:border-box}
.px :is(h1,h2,p){margin:0}
.px :is(button,input,select,textarea){font:inherit;color:inherit}
.px button{background:none;border:0;cursor:pointer;padding:0}
.px :focus-visible{outline:2px solid var(--px-gold);outline-offset:3px;border-radius:6px}
.px .ic{display:inline-flex;width:1em;height:1em;flex:none;vertical-align:-.125em}
.px .ic svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* ล้างสไตล์ฟอร์มทั้งแอปใน app.css (label เป็น grid · input กว้างเต็มและสูง 42px) ด้วย :where() ให้กฎของหน้านี้ชนะเสมอ */
:where(.px) label{display:block;gap:0;font-size:inherit;color:inherit}
.px :is(.px-rp,.px-sg) input{width:1px;height:1px;min-height:0;padding:0;margin:0;border:0}
.px-scroll{height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.px-shell{max-width:76rem;margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:720px){.px-shell{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}

/* หัวเว็บ */
.px-hdr{position:sticky;top:0;z-index:5;padding-top:env(safe-area-inset-top,0px);background:rgba(10,10,10,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--px-line)}
.px-hdr .px-shell{display:flex;align-items:center;gap:.75rem;padding-block:.75rem}
.px-x{flex:none;width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;border:1px solid var(--px-line2)!important;font-size:1.1rem}
.px-x:hover{border-color:var(--px-gold)!important}
.px-lockup{display:inline-flex;align-items:center;gap:.55rem;min-height:2.75rem;margin-right:auto;min-width:0}
.px-lockup .sym{width:1.6rem;height:1.8rem;color:var(--px-gold);flex:none}
.px-lockup .wm{display:flex;flex-direction:column;line-height:1;font-family:var(--px-en)}
.px-lockup .wm b{font-weight:800;letter-spacing:.08em;font-size:1rem}
.px-lockup .wm small{font-size:.42rem;font-weight:600;letter-spacing:.5em;margin-top:.45em;color:var(--px-muted)}
@media (max-width:400px){dialog.px .px-lockup .wm{display:none}} /* หน้าบุคลากรมีปุ่มปิดด้วย จอแคบจึงเหลือแค่สัญลักษณ์ */
.px-tabs{flex:none;display:flex;gap:.25rem;padding:.25rem;border:1px solid var(--px-line);border-radius:999px;background:var(--px-panel)}
.px-tab{display:inline-flex;align-items:center;gap:.4rem;min-height:2.5rem;padding:0 1rem!important;border-radius:999px;font-size:.875rem;font-weight:400;color:var(--px-muted)!important;transition:background .2s,color .2s;white-space:nowrap}
.px-tab .ic{font-size:1rem}
.px-tab:hover{color:var(--px-ivory)!important}
.px-tab[aria-selected="true"]{background:var(--px-gold)!important;color:var(--px-ink)!important;font-weight:500}
@media (max-width:480px){.px-tab .t-long{display:none}.px-tab{padding:0 .8rem!important}}

/* หัวหน้า */
.px-phead{padding-block:2.5rem 1.5rem;display:grid;gap:.75rem}
@media (min-width:720px){.px-phead{padding-block:3.5rem 2rem}}
.px-eyebrow{display:inline-flex;gap:.5rem;align-items:center}
.px-eyebrow .dot{width:.375rem;height:.375rem;border-radius:50%;background:var(--px-gold);flex:none}
.px-eyebrow .label{font:600 .6875rem/1.4 var(--px-en);text-transform:uppercase;letter-spacing:.24em;color:var(--px-muted)}
.px-eyebrow .th{font-family:var(--px-th);letter-spacing:.02em;font-weight:500}
.px-h1{font:600 2rem/1.2 var(--px-th);text-wrap:balance}
@media (min-width:720px){.px-h1{font-size:2.75rem}}
.px-lead{max-width:40rem;color:var(--px-muted);font-size:1rem}
.px-head-acts{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.25rem}
.px-empty-acts{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.req{color:var(--px-gold);margin-left:.15rem}

/* ปุ่มกรองประเภท */
.px-roles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
@media (min-width:720px){.px-roles{grid-template-columns:repeat(5,minmax(0,1fr));gap:.75rem}}
.px-rf{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;text-align:left;padding:.9rem 1rem!important;border:1px solid var(--px-line)!important;border-radius:1rem;background:var(--px-panel)!important;transition:border-color .2s,background .2s;min-width:0}
.px-rf:hover{border-color:var(--px-line2)!important}
.px-rf[aria-pressed="true"]{border-color:var(--px-gold)!important;background:var(--px-gold-soft)!important}
.px-rf .rk{display:flex;align-items:center;gap:.45rem;font-size:.8125rem;color:var(--px-muted);line-height:1.3}
.px-rf .rk i{width:.55rem;height:.55rem;border-radius:50%;background:var(--rc,var(--px-gold));flex:none}
.px-rf b{font:700 1.75rem/1 var(--px-en);font-variant-numeric:tabular-nums}
.px-rf.all{grid-column:1/-1}
@media (min-width:720px){.px-rf.all{grid-column:auto}}

/* ค้นหา + สถานะความพร้อม */
.px-toolbar{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between;margin-block:1.25rem 1rem}
.px-search{position:relative;flex:1 1 18rem;max-width:28rem;display:block}
.px-search>.ic{position:absolute;left:.95rem;top:50%;transform:translateY(-50%);color:var(--px-subtle);font-size:1.05rem}
.px-search .px-inp{min-height:2.875rem;padding:.6rem 1rem .6rem 2.6rem;border-radius:999px}
.px-chips{display:flex;gap:.4rem;flex-wrap:wrap}
.px-chip{display:inline-flex;align-items:center;gap:.4rem;min-height:2.25rem;padding:0 .85rem!important;border-radius:999px;border:1px solid var(--px-line2)!important;font-size:.8125rem;color:var(--px-muted)!important;transition:border-color .2s,color .2s,background .2s}
.px-chip[aria-pressed="true"]{border-color:var(--px-gold)!important;color:var(--px-ivory)!important;background:var(--px-gold-soft)!important}
.px-chip i,.px-avs i,.px-sg i{width:.45rem;height:.45rem;border-radius:50%;background:var(--ac,var(--px-gold));flex:none;display:inline-block}
.px-result{font-size:.8125rem;color:var(--px-subtle);margin-bottom:.75rem!important}
.px-notice{display:flex;gap:.6rem;align-items:center;border:1px solid var(--px-line-gold);background:var(--px-gold-soft);border-radius:1rem;padding:.85rem 1rem;font-size:.875rem;min-height:2.75rem}
.px-notice .ic{color:var(--px-gold);font-size:1.1rem}
.px-pend{margin-bottom:.75rem}
.px-pend>summary{list-style:none;cursor:pointer;margin:0}
.px-pend>summary::-webkit-details-marker{display:none}
.px-pend>summary>span{flex:1}
.px-pend>summary>.ic:last-child{color:var(--px-muted);transition:transform .2s}
.px-pend[open]>summary>.ic:last-child{transform:rotate(180deg)}
.px-pending{padding:.75rem 0 .5rem!important}

/* การ์ดบุคลากร */
.px-grid{display:grid;gap:.75rem;padding-bottom:4rem}
@media (min-width:640px){.px-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.px-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}}
.px-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9rem;align-items:start;text-align:left;width:100%;padding:1rem!important;border:1px solid var(--px-line)!important;border-radius:1.1rem;background:var(--px-panel)!important;transition:border-color .25s,transform .25s var(--px-e)}
.px-card.off{opacity:.6}
@media (hover:hover){.px-card:hover{border-color:var(--px-line-gold)!important;transform:translateY(-2px)}}
.px-av{width:3.5rem;height:3.5rem;border-radius:.9rem;overflow:hidden;display:grid;place-items:center;background:var(--px-panel2);border:1px solid var(--px-line);font:600 1.15rem/1 var(--px-th);color:var(--rc,var(--px-gold));flex:none}
.px-av img{width:100%;height:100%;object-fit:cover;display:block}
.px-av .ic{font-size:1.4rem;color:var(--px-subtle)}
.px-cbody{min-width:0;display:grid;gap:.3rem}
.px-cname{font-weight:500;font-size:1rem;line-height:1.35;overflow-wrap:anywhere}
.px-cname small{font-weight:300;color:var(--px-subtle);font-size:.8125rem;margin-left:.3rem}
.px-rbadge{display:inline-flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--rc);font-weight:400}
.px-rbadge i{width:.45rem;height:.45rem;border-radius:50%;background:var(--rc)}
.px-cspec{font-size:.875rem;color:var(--px-muted);line-height:1.45;overflow-wrap:anywhere}
.px-cmeta{display:flex;flex-wrap:wrap;gap:.35rem .9rem;font-size:.75rem;color:var(--px-subtle);margin-top:.2rem}
.px-cmeta>span{display:inline-flex;align-items:center;gap:.3rem;min-width:0}
.px-avs{display:inline-flex;align-items:center;gap:.35rem}
.px-avs i{width:.5rem;height:.5rem}
.px-empty{border:1px dashed var(--px-line2);border-radius:1.25rem;padding:2.5rem 1.5rem;display:grid;justify-items:center;gap:.75rem;text-align:center;color:var(--px-muted);margin-bottom:4rem}
.px-empty>.ic{font-size:2rem;color:var(--px-gold)}
.px-empty h2{font-weight:500;font-size:1.15rem;color:var(--px-ivory)}
.px-empty p{max-width:30rem;font-size:.9rem}
.px-skel{height:6.5rem;border-radius:1.1rem;background:linear-gradient(90deg,var(--px-panel) 0%,var(--px-panel2) 50%,var(--px-panel) 100%);background-size:200% 100%;animation:px-sh 1.4s infinite linear}
@keyframes px-sh{to{background-position:-200% 0}}

/* ปุ่ม */
.px-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.875rem;padding:0 1.4rem!important;border-radius:999px;font-weight:500;font-size:.9375rem;white-space:nowrap;transition:background .2s,border-color .2s,transform .2s var(--px-e)}
.px-btn:active{transform:scale(.97)}
.px-btn.gold{background:var(--px-gold)!important;color:var(--px-ink)!important;font-weight:600}
.px-btn.gold:hover{background:var(--px-gold-deep)!important}
.px-btn.out{border:1px solid var(--px-line2)!important}
.px-btn.out:hover{border-color:var(--px-gold)!important}
.px-btn[disabled]{opacity:.5;cursor:progress}

/* ฟอร์ม */
.px-form{display:grid;gap:1rem;padding-bottom:2rem}
.px-fsec{border:1px solid var(--px-line);border-radius:1.25rem;background:var(--px-panel);padding:1.25rem;display:grid;gap:1.1rem}
@media (min-width:720px){.px-fsec{grid-template-columns:14rem minmax(0,1fr);gap:2rem;padding:1.75rem}}
.px-fsec-h{display:grid;gap:.35rem;align-content:start}
.px-fsec-h .n{font:600 .75rem/1 var(--px-en);letter-spacing:.2em;color:var(--px-gold)}
.px-fsec-h h2{font-weight:500;font-size:1.1rem;line-height:1.35}
.px-fsec-h p{font-size:.8125rem;color:var(--px-subtle)}
.px-fields{display:grid;gap:1rem;min-width:0}
.px-row{display:grid;gap:1rem}
@media (min-width:560px){.px-row.c2{grid-template-columns:repeat(2,minmax(0,1fr))}.px-row.c3{grid-template-columns:8rem repeat(2,minmax(0,1fr))}}
.px-fld{display:grid;gap:.4rem;min-width:0}
.px-fld[hidden]{display:none}
.px-fld>label{font-size:.875rem;font-weight:400}
.px-hint{font-size:.75rem;color:var(--px-subtle)}
.px .px-inp{width:100%;min-height:2.875rem;padding:.6rem .9rem;border-radius:.75rem;border:1px solid var(--px-line2);background:var(--px-field);font-size:.9375rem;font-weight:300;color:var(--px-ivory);transition:border-color .2s}
.px .px-inp::placeholder{color:var(--px-subtle)}
.px .px-inp:focus{outline:none;border-color:var(--px-gold)}
.px textarea.px-inp{min-height:7rem;resize:vertical;line-height:1.6}
.px select.px-inp{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--px-muted) 50%),linear-gradient(135deg,var(--px-muted) 50%,transparent 50%);background-position:calc(100% - 1.1rem) 52%,calc(100% - .8rem) 52%;background-size:.3rem .3rem;background-repeat:no-repeat;padding-right:2.2rem}
.px-fld.bad .px-inp{border-color:var(--px-danger)}
.px-err{display:none;font-size:.75rem;color:var(--px-danger)}
.px-fld.bad .px-err{display:block}
.px-rolepick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
@media (min-width:900px){.px-rolepick{grid-template-columns:repeat(4,minmax(0,1fr))}}
.px-rp{position:relative;display:grid;gap:.2rem;padding:.85rem .9rem;border:1px solid var(--px-line2);border-radius:.9rem;background:var(--px-field);cursor:pointer;transition:border-color .2s,background .2s;min-width:0}
.px-rp input{position:absolute;opacity:0;pointer-events:none}
.px-rp b{display:flex;align-items:center;gap:.45rem;font-weight:500;font-size:.9375rem}
.px-rp b i{width:.55rem;height:.55rem;border-radius:50%;background:var(--rc);flex:none}
.px-rp span{font:600 .625rem/1.3 var(--px-en);letter-spacing:.16em;color:var(--px-subtle)}
.px-rp:has(input:checked){border-color:var(--rc);background:color-mix(in srgb,var(--rc) 12%,var(--px-field))}
.px-rp:has(input:focus-visible){outline:2px solid var(--px-gold);outline-offset:2px}
.px-fld.bad .px-rp{border-color:rgba(255,90,71,.5)}
.px-seg{display:flex;flex-wrap:wrap;gap:.5rem}
.px-sg{position:relative;display:inline-flex;align-items:center;gap:.45rem;min-height:2.5rem;padding:0 .95rem;border:1px solid var(--px-line2);border-radius:999px;font-size:.875rem;color:var(--px-muted);cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.px-sg input{position:absolute;opacity:0;pointer-events:none}
.px-sg i{width:.5rem;height:.5rem}
.px-sg:has(input:checked){border-color:var(--px-gold);color:var(--px-ivory);background:var(--px-gold-soft)}
.px-sg:has(input:focus-visible){outline:2px solid var(--px-gold);outline-offset:2px}
.px-sg .ck{display:none;color:var(--px-gold)}
.px-sg:has(input[type=checkbox]:checked) .ck{display:inline}
.px-photo{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.px-photo .acts{display:flex;gap:.5rem;flex-wrap:wrap}
.px-filebtn{position:relative;overflow:hidden;cursor:pointer}
.px-filebtn input{position:absolute;inset:0;opacity:0;cursor:pointer}
.px-toggle{display:flex;align-items:flex-start;gap:.75rem;cursor:pointer;padding:.85rem 1rem;border:1px solid var(--px-line);border-radius:.9rem;background:var(--px-field)}
.px .px-toggle input{appearance:none;-webkit-appearance:none;width:2.6rem;min-width:2.6rem;height:1.5rem;min-height:1.5rem;padding:0;border:0;border-radius:999px;background:var(--px-line2);position:relative;flex:none;cursor:pointer;transition:background .2s;margin-top:.1rem}
.px .px-toggle input::after{content:"";position:absolute;top:.2rem;left:.2rem;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--px-ivory);transition:transform .2s var(--px-e)}
.px .px-toggle input:checked{background:var(--px-gold)}
.px .px-toggle input:checked::after{transform:translateX(1.1rem);background:var(--px-ink)}
.px .px-toggle input:disabled{opacity:.5;cursor:not-allowed}
.px-toggle b{display:block;font-weight:400;font-size:.9rem}
.px-toggle small{display:block;font-size:.75rem;color:var(--px-subtle)}

/* แถบบันทึกติดล่างจอ */
.px-fbar{position:sticky;bottom:0;z-index:4;background:rgba(10,10,10,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--px-line);padding-bottom:env(safe-area-inset-bottom,0px)}
.px-fbar[hidden]{display:none}
.px-fbar .px-shell{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-block:.75rem}
.px-fbar .st{font-size:.8125rem;color:var(--px-subtle);min-width:0}
.px-fbar .acts{display:flex;gap:.5rem;flex:none}
@media (max-width:480px){.px-fbar .st{display:none}.px-fbar .acts{width:100%}.px-fbar .acts .px-btn{flex:1}}
/* แผ่นชวนกรอกข้อมูล (inviteSheet ใน app.js): มือถือ = แผ่นล่างจอ · จอใหญ่ = การ์ดกลางจอ */
dialog.px.px-sheet{inset:auto 0 0 0;width:100%;height:auto;max-height:92dvh;overflow-y:auto;overscroll-behavior:contain;background:var(--px-panel);
  border:1px solid var(--px-line2);border-bottom:0;border-radius:1.4rem 1.4rem 0 0;animation:px-up .32s var(--px-e)}
dialog.px.px-sheet::backdrop{background:rgba(0,0,0,.62);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
@media (min-width:720px){dialog.px.px-sheet{inset:0;margin:auto;width:min(32rem,calc(100% - 4rem));max-height:calc(100dvh - 4rem);border-bottom:1px solid var(--px-line2);border-radius:1.4rem}}
@keyframes px-up{from{transform:translateY(28px);opacity:.4}}
.px-sheet-in{display:grid;gap:1rem;padding:.6rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom,0px))}
@media (min-width:720px){.px-sheet-in{padding:1.25rem 1.75rem 1.75rem}}
.px-sheet-grip{justify-self:center;width:2.5rem;height:.3rem;border-radius:999px;background:var(--px-line2)}
@media (min-width:720px){.px-sheet-grip{display:none}}
.px-sheet-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.px-sheet-title{font:600 1.5rem/1.25 var(--px-th);margin-top:-.25rem!important}
.px-sheet-sub{color:var(--px-muted);font-size:.9rem;margin-top:-.6rem!important}
.px-sheet-sec{display:grid;gap:.5rem;min-width:0}
.px-sheet-lab{font-size:.8125rem;color:var(--px-muted)}
.px-sheet-lab small{color:var(--px-subtle);font-size:.75rem}
.px-roles-row{flex-wrap:wrap}
.px-roles-row .px-chip{min-height:2.5rem;font-size:.875rem}
.px .px-bubble{min-height:9.5rem;border-radius:1.1rem 1.1rem 1.1rem .35rem;background:var(--px-panel2);border-color:var(--px-line);line-height:1.65;font-size:.9rem;resize:vertical}
.px-btn.px-line{width:100%;min-height:3.25rem;background:#06C755!important;color:#fff!important;font-weight:600;font-size:1rem}
.px-btn.px-line:hover{background:#05b14c!important}
.px-sheet-row{display:flex;gap:.6rem;margin-top:-.4rem}
.px-sheet-row .px-btn{flex:1;min-width:0}
.px-link{display:flex;align-items:center;gap:.6rem;min-height:3rem;padding:.35rem .4rem .35rem .95rem;border:1px solid var(--px-line2);border-radius:999px;background:var(--px-field);min-width:0}
.px-link>.ic{color:var(--px-gold);flex:none}
.px-link-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 .875rem/1.3 var(--px-en);color:var(--px-ivory)}
.px-link-cp{flex:none;width:2.4rem;height:2.4rem;border-radius:50%;display:grid;place-items:center;background:var(--px-gold-soft)!important;color:var(--px-gold)!important}
.px-link-cp:hover{background:var(--px-gold)!important;color:var(--px-ink)!important}
.px-qr{display:grid;justify-items:center;gap:.6rem;padding:1.25rem;border-radius:1.1rem;background:#fff;color:#0A0A0A}
.px-qr[hidden]{display:none}
.px-qr canvas{width:min(15rem,70vw)!important;height:auto!important;image-rendering:pixelated}
.px-qr small{font-size:.8125rem;color:#555}
.px-sheet-foot{display:flex;gap:.5rem;align-items:flex-start;font-size:.78rem;color:var(--px-subtle);border-top:1px solid var(--px-line);padding-top:.9rem}
.px-sheet-foot .ic{color:var(--px-gold);margin-top:.15rem}

/* หน้าสมัคร /experts/apply/: ขั้นตอนสั้น · หน้าส่งเสร็จ · แจ้งเตือน · กับดักบอท */
.px a{color:inherit}
.px a.px-btn,.px a.px-lockup{text-decoration:none}
.px-steps{list-style:none;margin:.25rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem .9rem;font-size:.8125rem;color:var(--px-muted)}
.px-steps li{display:inline-flex;align-items:center;gap:.4rem}
.px-steps b{display:inline-grid;place-items:center;width:1.35rem;height:1.35rem;border-radius:50%;background:var(--px-gold-soft);color:var(--px-gold);font:600 .7rem/1 var(--px-en)}
.px-done{display:grid;justify-items:center;gap:.9rem;text-align:center;padding:3.5rem 0 4rem;max-width:34rem;margin:0 auto}
.px-done .px-lead{margin:0 auto}
.px-done-ic{font-size:3rem;color:var(--px-gold)}
.px-done .px-hint a{color:var(--px-gold);text-decoration:none}
.px-toast{position:fixed;left:50%;bottom:calc(5.5rem + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:90;max-width:calc(100% - 32px);background:var(--px-ivory);color:var(--px-ink);font-weight:500;font-size:.9rem;padding:.7rem 1.1rem;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.px-toast[hidden]{display:none}
.px-hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
@media (prefers-reduced-motion:reduce){.px *{animation:none!important;transition:none!important}}