*{box-sizing:border-box}
:root{--gold:#f4b91d;--gold2:#ffe27b;--line:rgba(244,185,29,.34)}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:#fff;background:#020202}
body{overflow-x:hidden}.background{position:fixed;inset:0;background:url("background.jpg") center center/cover no-repeat;z-index:0}.shade{position:fixed;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.42) 48%,rgba(0,0,0,.72)),radial-gradient(ellipse at 50% 25%,transparent 0 36%,rgba(0,0,0,.28) 80%);pointer-events:none}
.topbar{position:relative;z-index:3;height:55px;background:rgba(2,2,2,.72);border-bottom:1px solid rgba(244,185,29,.18);backdrop-filter:blur(12px)}.top-inner{max-width:1100px;height:100%;margin:auto;padding:0 18px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:14px;font-weight:950;letter-spacing:3px}.brand span{color:var(--gold);margin-right:7px}.live{border:1px solid rgba(244,185,29,.38);border-radius:999px;padding:7px 12px;font-size:9px;font-weight:900;letter-spacing:2px}.live i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold);margin-right:6px}
main{position:relative;z-index:3;max-width:1150px;margin:auto;padding:18px 18px 28px}.hero{text-align:center;position:relative}.logo{width:min(520px,76vw);height:175px;object-fit:contain;object-position:center;filter:drop-shadow(0 0 24px rgba(255,188,30,.22));margin:-8px auto -25px;display:block}.eyebrow{font-size:9px;letter-spacing:4px;font-weight:950;color:var(--gold2)}h1{font-size:clamp(31px,4.3vw,48px);line-height:1.02;margin:10px 0 7px;letter-spacing:-1.6px;text-shadow:0 5px 22px #000}h1 b{color:var(--gold2)}.hero p{font-size:12px;color:#b4afa4;margin:0 0 18px}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:14px}.mini{height:54px;display:flex;align-items:center;gap:10px;padding:10px 13px;border:1px solid rgba(244,185,29,.2);border-radius:10px;background:rgba(5,5,5,.78);backdrop-filter:blur(12px);box-shadow:inset 0 1px rgba(255,255,255,.025)}.mini>span{font-size:18px;color:var(--gold)}.mini b{font-size:10px}.mini small{display:block;font-size:8px;color:#77736b;font-weight:500;margin-top:3px}
.columns{display:grid;grid-template-columns:1.45fr .78fr;gap:14px}.card{background:rgba(5,5,5,.88);border:1px solid var(--line);border-radius:15px;box-shadow:0 18px 45px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.035);backdrop-filter:blur(13px)}.donation{padding:22px}.goal,.supporters{padding:17px}.card-title{display:flex;align-items:center;gap:10px;margin-bottom:15px}.card-title .icon{color:var(--gold);font-size:21px;text-shadow:0 0 15px rgba(244,185,29,.35)}.card-title small{font-size:9px;letter-spacing:2px;color:#bda65e;font-weight:950}.card-title h2{font-size:15px;margin:4px 0 0}.close{margin-left:auto;color:var(--gold);font-size:25px;font-weight:200}.pct{margin-left:auto;color:var(--gold);font-size:10px}
.amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.amounts button{height:45px;border:1px solid #292929;border-radius:9px;background:#070707;color:#ddd;font-weight:900;cursor:pointer}.amounts button.active,.amounts button:hover{border-color:var(--gold);background:linear-gradient(#342608,#100d06);box-shadow:0 0 22px rgba(244,185,29,.16);color:#fff}
label{display:block;margin:13px 0 7px;color:#aaa396;font-size:10px;font-weight:900;letter-spacing:.1px}label em{font-style:normal;color:#756e62;font-weight:700}.input,.money{width:100%;height:44px;border:1px solid #222;background:#030303;border-radius:9px;color:#fff;outline:0}.input{padding:0 12px}.input:focus,.money:focus-within{border-color:#c28c18;box-shadow:0 0 0 3px rgba(244,185,29,.06)}.money{display:flex;align-items:center}.money>span{display:flex;align-items:center;height:100%;padding:0 6px 0 14px;color:#d9ad43;font-size:15px;font-weight:950;line-height:1}.money input{flex:1;width:0;height:100%;display:block;box-sizing:border-box;background:transparent;border:0;outline:0;color:#fff;padding:0 12px 0 4px;font-size:15px;font-weight:900;line-height:44px;vertical-align:middle}.message{height:78px;padding-top:12px;resize:vertical}.donate{width:100%;height:49px;margin-top:15px;border:0;border-radius:9px;background:linear-gradient(90deg,#e5a713,#ffd85f);color:#110c02;font-weight:950;cursor:pointer;box-shadow:0 9px 28px rgba(244,185,29,.18)}.donate b{float:right;font-size:18px;margin-right:14px}.demo{text-align:center;color:#656057;font-size:8px;margin-top:10px}
aside{display:flex;flex-direction:column;gap:14px}.goal-total{font-size:23px;font-weight:950}.goal-total span{font-size:10px;color:#777}.progress{height:8px;background:#17150f;border-radius:99px;overflow:hidden;margin:11px 0}.progress i{display:block;width:30%;height:100%;background:linear-gradient(90deg,#db9711,#ffe17b);box-shadow:0 0 13px #e6ad2b}.goal p{font-size:8px;color:#777168;margin:0}.support{display:grid;grid-template-columns:25px 1fr auto 55px;gap:7px;align-items:center;padding:10px 0;border-top:1px solid #1c1b18}.support>span{color:var(--gold)}.support b{display:block;font-size:9px}.support div small{display:block;color:#68635b;font-size:7px;margin-top:2px}.support strong{font-size:9px;color:var(--gold);text-align:right}.support>small{font-size:7px;color:#666;text-align:right}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:14px}.features>div{height:48px;display:flex;gap:8px;align-items:center;padding:9px 13px;border:1px solid rgba(244,185,29,.16);border-radius:10px;background:rgba(4,4,4,.76);font-size:14px}.features b{font-size:9px}.features small{display:block;color:#68635c;font-size:7px;font-weight:500;margin-top:3px}
#result{margin-top:10px}.success{padding:10px;border:1px solid rgba(87,213,137,.25);background:rgba(49,180,106,.08);border-radius:8px;color:#8ee2ac;font-size:9px}
footer{position:relative;z-index:3;text-align:center;padding:20px;color:#49443b;font-size:7px;letter-spacing:3px}footer span{margin:0 8px}
@media(max-width:800px){.benefits,.features{grid-template-columns:1fr 1fr}.columns{grid-template-columns:1fr}.logo{height:155px;margin-bottom:-18px}}
@media(max-width:520px){main{padding-left:10px;padding-right:10px}.amounts{grid-template-columns:1fr 1fr}.logo{height:140px;margin-top:0;margin-bottom:-12px}h1{font-size:30px}.support{grid-template-columns:23px 1fr auto}.support>small{display:none}}

html,body{min-height:100%;background:#020202}


/* Payment status UI */
.hidden{display:none!important}
.payment-panel{margin-top:14px;border:1px solid rgba(244,185,29,.42);border-radius:13px;background:linear-gradient(145deg,rgba(24,18,6,.96),rgba(5,5,5,.96));box-shadow:0 12px 35px rgba(0,0,0,.42),0 0 25px rgba(244,185,29,.07);overflow:hidden}
.payment-head{display:flex;align-items:center;gap:10px;padding:14px 15px;border-bottom:1px solid rgba(244,185,29,.16)}
.payment-head small,.result-panel>small{font-size:8px;letter-spacing:2px;color:#c4a653;font-weight:950}
.payment-head h3{margin:3px 0 0;font-size:13px}.status-dot{width:9px;height:9px;border-radius:50%;background:#f4b91d;box-shadow:0 0 14px #f4b91d}.badge{margin-left:auto;font-size:7px;font-weight:950;letter-spacing:1px;border-radius:99px;padding:6px 8px}.badge.pending{color:#f7c846;border:1px solid rgba(244,185,29,.3);background:rgba(244,185,29,.07)}
.payment-body{display:grid;grid-template-columns:130px 1fr;gap:18px;padding:15px}.qr-box{height:150px;border-radius:10px;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#111;gap:7px}.qr-box>small{font-size:7px;font-weight:950;letter-spacing:1px}.fake-qr{width:91px;height:91px;position:relative;background:repeating-linear-gradient(90deg,#111 0 4px,#fff 4px 8px),repeating-linear-gradient(0deg,transparent 0 5px,#111 5px 8px);border:6px solid #fff;overflow:hidden}.fake-qr:before,.fake-qr:after{content:"";position:absolute;width:22px;height:22px;background:#111;border:5px solid #fff;box-shadow:inset 0 0 0 5px #111}.fake-qr:before{left:3px;top:3px}.fake-qr:after{right:3px;bottom:3px}.fake-qr span{position:absolute;z-index:2;left:30px;top:34px;background:#fff;border:2px solid #111;padding:3px;font-size:9px;font-weight:950}
.payment-info{display:flex;flex-direction:column;justify-content:center;gap:10px}.payment-info>div:not(.waiting-line){display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.06)}.payment-info span{font-size:8px;color:#777}.payment-info b{font-size:11px;color:#fff}.payment-info>div:nth-child(2) b{font-size:9px;color:#e7b92f;letter-spacing:.6px}.waiting-line{display:flex;align-items:center;gap:7px;color:#a39b8a;font-size:8px}.waiting-line i{width:7px;height:7px;border-radius:50%;background:#f4b91d;box-shadow:0 0 9px #f4b91d;animation:pulse 1.3s infinite}.payment-progress{height:4px;background:#19160f}.payment-progress i{display:block;width:45%;height:100%;background:linear-gradient(90deg,#d9930e,#ffe47c);animation:progress 2.5s infinite ease-in-out}.payment-hint{font-size:7px;color:#666158;text-align:center;margin:9px 0 11px}.demo-actions{display:flex;gap:8px;padding:0 15px 14px}.demo-actions button,.fail-panel button{flex:1;border:1px solid rgba(244,185,29,.25);border-radius:7px;background:#0b0a07;color:#d6b54e;height:31px;font-size:8px;font-weight:900;cursor:pointer}.demo-actions button:hover,.fail-panel button:hover{border-color:#eab52d;background:#211805}
.result-panel{margin-top:14px;border-radius:13px;text-align:center;padding:19px 15px}.success-panel{border:1px solid rgba(74,207,127,.35);background:linear-gradient(145deg,rgba(6,31,18,.95),rgba(4,10,7,.96))}.fail-panel{border:1px solid rgba(255,83,83,.3);background:linear-gradient(145deg,rgba(39,8,8,.95),rgba(8,4,4,.96))}.result-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 9px;font-size:22px;font-weight:950}.success-panel .result-icon{background:#123d25;color:#71df9b;box-shadow:0 0 22px rgba(71,220,139,.12)}.fail-panel .result-icon{background:#401313;color:#ff8d8d}.result-panel h3{font-size:14px;margin:6px 0}.success-panel>strong{display:block;font-size:25px;color:#f8ca4c;margin:8px}.reward-box{border:1px dashed rgba(244,185,29,.38);border-radius:9px;padding:11px;background:rgba(244,185,29,.045);margin-top:10px}.reward-box span{display:block;font-size:7px;color:#a9955c;letter-spacing:1.5px;font-weight:950}.reward-box b{display:block;color:#fff;font-size:12px;letter-spacing:1px;margin:7px}.reward-box button{border:1px solid rgba(244,185,29,.3);background:#151006;color:#f5c84b;border-radius:6px;padding:6px 9px;font-size:7px;font-weight:900;cursor:pointer}.result-panel p{font-size:8px;color:#777;margin:9px 0 0}.fail-panel p{font-size:8px;color:#777}.fail-panel p b{color:#e8bd42}.fail-panel button{max-width:180px}
@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}@keyframes progress{0%{transform:translateX(-100%)}50%{transform:translateX(40%)}100%{transform:translateX(190%)}}
@media(max-width:520px){.payment-body{grid-template-columns:1fr}.qr-box{width:150px;margin:auto}.demo-actions{flex-direction:column}}


/* V2 checkout UI */
.payment-panel{margin-top:15px;border:1px solid rgba(244,185,29,.48);border-radius:14px;background:linear-gradient(145deg,rgba(15,12,5,.98),rgba(3,3,3,.98));box-shadow:0 15px 45px rgba(0,0,0,.58),0 0 30px rgba(244,185,29,.08);overflow:hidden}
.payment-head{display:flex;align-items:center;gap:11px;padding:15px 16px;border-bottom:1px solid rgba(244,185,29,.16)}
.payment-head small{font-size:8px;letter-spacing:2px;color:#d0ad51;font-weight:950}.payment-head h3{font-size:15px;margin:3px 0 0}.status-dot{width:9px;height:9px;border-radius:50%;background:#f4b91d;box-shadow:0 0 13px #f4b91d}.badge{margin-left:auto;border-radius:99px;padding:6px 9px;font-size:7px;font-weight:950;letter-spacing:1px;color:#f6ca50;border:1px solid rgba(244,185,29,.35);background:rgba(244,185,29,.07)}
.pay-methods{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:13px 15px 0}.method{display:flex;align-items:center;gap:9px;text-align:left;border:1px solid #28251d;background:#080807;color:#fff;border-radius:9px;padding:9px;cursor:pointer}.method.active{border-color:#e0ad25;background:linear-gradient(145deg,#211807,#0b0905);box-shadow:0 0 17px rgba(244,185,29,.08)}.method>i{margin-left:auto;color:#f4c33d;font-style:normal;font-size:11px}.method:not(.active)>i{opacity:0}.method b{font-size:9px;display:block}.method small{font-size:7px;color:#777;display:block;margin-top:2px}.tng,.duit{width:27px;height:27px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-weight:950;font-size:14px}.tng{background:#12a87b;color:#fff}.duit{background:#fff;color:#111}
.payment-main{display:grid;grid-template-columns:190px 1fr;gap:18px;padding:15px}.qr-card{background:#fff;border-radius:11px;padding:11px;text-align:center;color:#111;display:flex;flex-direction:column;align-items:center;justify-content:center}.qr-label{font-size:8px;letter-spacing:1.5px;font-weight:950;margin-bottom:8px}.fake-qr{width:145px;height:145px;background:repeating-linear-gradient(0deg,#111 0 4px,#fff 4px 8px),repeating-linear-gradient(90deg,transparent 0 5px,#111 5px 8px);position:relative;overflow:hidden;border:5px solid #fff;box-shadow:0 0 0 1px #ddd}.fake-qr:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(0,0,0,.85) 7px 10px);mix-blend-mode:multiply}.finder{position:absolute;width:32px;height:32px;background:#111;border:6px solid #fff;box-shadow:0 0 0 4px #111;z-index:2}.f1{left:8px;top:8px}.f2{right:8px;top:8px}.f3{left:8px;bottom:8px}.qr-noise{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;border:2px solid #111;border-radius:4px;padding:5px;font-weight:950;font-size:10px}.qr-brand{font-size:10px;font-weight:950;margin-top:8px;display:flex;gap:5px;align-items:center}.qr-brand .tng{width:20px;height:20px;font-size:11px;border-radius:5px}.demo-qr{font-size:6px;color:#888;margin-top:5px;letter-spacing:.4px}
.payment-info{display:flex;flex-direction:column;justify-content:center;gap:8px}.pay-total,.pay-ref{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:8px}.pay-total span,.pay-ref span{font-size:7px;color:#777;letter-spacing:1px;font-weight:800}.pay-total b{font-size:20px;color:#f6c84e}.pay-ref b{font-size:9px;color:#e4b633;letter-spacing:.8px}.instruction{display:flex;align-items:center;gap:8px}.instruction .step{width:18px;height:18px;border-radius:50%;background:#211a0b;border:1px solid #9d7617;color:#f3c13e;font-size:8px;font-weight:950;display:flex;align-items:center;justify-content:center;flex:none}.instruction p{margin:0;font-size:8px;color:#aaa49a}.instruction p b{color:#fff}.waiting-line{display:flex;align-items:center;gap:7px;margin-top:2px;color:#b4a77f;font-size:8px}.waiting-line i{width:7px;height:7px;border-radius:50%;background:#f4b91d;box-shadow:0 0 10px #f4b91d;animation:pulse 1.2s infinite}.payment-progress{height:4px;background:#17130b;overflow:hidden}.payment-progress i{display:block;height:100%;width:38%;background:linear-gradient(90deg,#d8910d,#ffe27c);animation:progress 2.4s infinite ease-in-out}.demo-actions{display:flex;gap:8px;padding:12px 15px 15px}.demo-actions button{flex:1;height:32px;border-radius:7px;border:1px solid rgba(244,185,29,.3);background:#0b0905;color:#e7bf49;font-size:8px;font-weight:950;cursor:pointer}.demo-actions button:first-child{background:linear-gradient(90deg,#2b210c,#171106)}.demo-actions button:hover{border-color:#f0bd39}
@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}@keyframes progress{0%{transform:translateX(-120%)}100%{transform:translateX(300%)}}
@media(max-width:620px){.pay-methods,.payment-main{grid-template-columns:1fr}.qr-card{max-width:210px;margin:auto}.payment-info{padding-top:2px}}

/* V3: guaranteed visible checkout state */
.payment-panel{position:relative;z-index:20}
.payment-panel:not(.hidden){animation:checkoutIn .22s ease-out}
@keyframes checkoutIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Real payment brand logos */
.pay-methods{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:13px 15px 0}
.method{min-height:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;position:relative;padding:8px 5px}
.method img{width:30px;height:30px;object-fit:contain;border-radius:6px}
.method div{min-width:0}
.method b{font-size:8px;white-space:nowrap}
.method small{font-size:6px;white-space:nowrap}
.method>i{position:absolute;right:6px;top:5px}
.qr-brand img{width:22px;height:22px;object-fit:contain;border-radius:4px;vertical-align:middle}
@media(max-width:800px){.pay-methods{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.pay-methods{grid-template-columns:repeat(2,1fr)}}

/* V5 method-specific checkout */
.method-title{display:flex;align-items:baseline;gap:9px;padding:15px 15px 7px;color:#fff}.method-title>span{color:#f5c545;font-size:18px}.method-title b{font-size:13px}.method-title small{font-size:7px;color:#777;margin-left:4px}
.pay-methods{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:5px 15px 14px}.method{min-height:88px!important}.method.active{box-shadow:0 0 25px rgba(244,185,29,.14),inset 0 0 18px rgba(244,185,29,.04)}
.checkout-grid{display:grid;grid-template-columns:210px 1fr;gap:18px;padding:0 15px 15px}.checkout-qr{background:#fff;border-radius:11px;padding:12px;text-align:center;color:#111;display:flex;flex-direction:column;align-items:center;justify-content:center}.checkout-info{padding:4px 0}.steps-title{font-size:8px;color:#c3a750;font-weight:950;letter-spacing:1.5px;margin:9px 0 7px}.pay-step{display:flex;gap:8px;align-items:flex-start;margin:6px 0}.pay-step>span{width:19px;height:19px;flex:none;border-radius:50%;border:1px solid #b98b18;color:#f3c33d;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:950;background:#171106}.pay-step p{margin:2px 0 0;font-size:8px;color:#aaa49a;line-height:1.3}.pay-step p::first-letter{}.waiting-line{margin-top:9px}
@media(max-width:850px){.pay-methods{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.pay-methods{grid-template-columns:repeat(2,1fr)}.checkout-grid{grid-template-columns:1fr}.checkout-qr{max-width:220px;margin:auto}}

/* V6 — normalized payment logos */
.pay-methods .method{
  min-height:96px!important;
  padding:10px 6px 9px!important;
  justify-content:center;
  border-radius:11px;
  overflow:hidden;
}
.pay-methods .method img{
  width:42px!important;
  height:42px!important;
  display:block;
  object-fit:contain;
  object-position:center;
  flex:0 0 42px;
  margin:0 auto 5px;
  border-radius:9px;
}
.pay-methods .method div{
  width:100%;
  text-align:center;
  line-height:1.1;
}
.pay-methods .method b{
  display:block;
  font-size:9px!important;
  line-height:1.15;
}
.pay-methods .method small{
  display:block;
  margin-top:3px;
  font-size:6.5px!important;
  line-height:1.15;
}
.pay-methods .method>i{
  right:7px!important;
  top:7px!important;
}
@media(max-width:850px){
  .pay-methods .method img{width:38px!important;height:38px!important;flex-basis:38px}
}

/* V8 — rebuilt crisp payment brand assets */
.pay-methods{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:6px 15px 15px}
.pay-methods .method{
  height:112px!important; min-height:112px!important; box-sizing:border-box;
  padding:10px 7px 9px!important; gap:6px; border-radius:13px;
  background:linear-gradient(180deg,#11110f 0%,#080807 100%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 18px rgba(0,0,0,.22);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.pay-methods .method:hover{transform:translateY(-2px);border-color:rgba(244,185,29,.38);box-shadow:0 10px 25px rgba(0,0,0,.35),0 0 18px rgba(244,185,29,.05)}
.pay-methods .method.active{border-color:#e7b51f;background:linear-gradient(180deg,#211b0b 0%,#0b0905 100%);box-shadow:0 0 0 1px rgba(244,185,29,.10),0 0 26px rgba(244,185,29,.13),inset 0 0 22px rgba(244,185,29,.045)}
.pay-methods .method img{width:52px!important;height:52px!important;flex:0 0 52px;object-fit:contain;object-position:center;margin:0 auto 1px;border-radius:0;display:block}
.pay-methods .method:nth-child(3) img,.pay-methods .method:nth-child(4) img{border-radius:8px}
.pay-methods .method div{width:100%;min-width:0;text-align:center;line-height:1.1}
.pay-methods .method b{font-size:9.5px!important;line-height:1.15;color:#f4f2ed;white-space:nowrap;text-decoration:none}
.pay-methods .method small{font-size:6.3px!important;line-height:1.15;color:#74716b;margin-top:4px;white-space:nowrap;text-decoration:none}
.pay-methods .method>i{right:8px!important;top:7px!important;font-size:11px}
.method-title>span{font-size:16px}
.method-title b{font-size:14px}
.method-title small{font-size:7px;color:#68655f}
/* remove accidental link-style decoration inside checkout */
.payment-panel a,.payment-panel a:visited,.payment-panel a:hover{text-decoration:none;color:inherit}
@media(max-width:850px){.pay-methods{grid-template-columns:repeat(3,1fr)}.pay-methods .method{height:108px!important;min-height:108px!important}.pay-methods .method img{width:48px!important;height:48px!important;flex-basis:48px}}
@media(max-width:620px){.pay-methods{grid-template-columns:repeat(2,1fr)}}

/* FINAL PAYMENT LOGO PASS — use the full high-resolution brand artwork */
.pay-methods .method img{width:58px!important;height:58px!important;object-fit:contain;object-position:center;background:transparent!important;border-radius:0!important;image-rendering:auto}
.pay-methods .method:nth-child(1) img{width:62px!important;height:52px!important}
.pay-methods .method:nth-child(2) img{width:58px!important;height:58px!important}
.pay-methods .method:nth-child(3) img{width:58px!important;height:58px!important}
.pay-methods .method:nth-child(4) img{width:78px!important;height:52px!important}
.pay-methods .method:nth-child(5) img{width:52px!important;height:52px!important}
.checkout-qr .qr-brand img{width:42px;height:42px;object-fit:contain;background:transparent;border-radius:0}
@media(max-width:850px){
  .pay-methods .method:nth-child(1) img,.pay-methods .method:nth-child(2) img,.pay-methods .method:nth-child(3) img{width:52px!important;height:52px!important}
  .pay-methods .method:nth-child(4) img{width:68px!important;height:46px!important}
}

/* V10 — FPX bank selector */
.fpx-bank-panel{margin:0 15px 14px;border:1px solid #29261f;border-radius:12px;background:linear-gradient(180deg,#0d0c09,#080806);padding:12px}
.fpx-bank-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}
.fpx-bank-head b{display:block;font-size:11px;color:#f4f2ed}.fpx-bank-head small{display:block;font-size:7px;color:#777;margin-top:2px}
#selectedBankLabel{font-size:7px;color:#d7a91f;border:1px solid #4a3910;border-radius:20px;padding:5px 8px;white-space:nowrap}
.bank-search-wrap{height:32px;display:flex;align-items:center;gap:7px;border:1px solid #28251f;background:#050504;border-radius:7px;padding:0 9px;margin-bottom:9px}.bank-search-wrap span{color:#a89052;font-size:15px}.bank-search-wrap input{width:100%;border:0;outline:0;background:transparent;color:#eee;font-size:10px}.bank-search-wrap input::placeholder{color:#5f5b54}
.bank-list{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;max-height:190px;overflow:auto;padding-right:2px}.fpx-bank{display:flex;align-items:center;gap:7px;min-width:0;height:43px;padding:5px 7px;border:1px solid #24221d;background:#0b0b09;color:#ddd;border-radius:7px;text-align:left;cursor:pointer;transition:.15s}.fpx-bank:hover{border-color:#8e6e18;background:#121007}.fpx-bank.active{border-color:#e3b51f;background:#1c1608;box-shadow:0 0 15px rgba(244,185,29,.08)}.fpx-bank span:nth-child(2){font-size:8px;line-height:1.15;min-width:0}.fpx-bank i{margin-left:auto;color:#6d675c;font-style:normal}.bank-logo{width:25px;height:25px;flex:0 0 25px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:#17150f;border:1px solid #302914;color:#d7ad35;font-size:7px;font-weight:800}.bank-empty{grid-column:1/-1;text-align:center;color:#777;font-size:9px;padding:18px}
@media(max-width:850px){.bank-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.bank-list{grid-template-columns:1fr}}

/* V12 manual payment verification */
.manual-note{margin:0 15px 12px;padding:10px 12px;border:1px solid rgba(244,185,29,.18);background:rgba(244,185,29,.045);border-radius:8px;color:#a9a08e;font-size:8px;line-height:1.45}.receipt-box{margin:0 15px 15px;padding:13px;border:1px solid rgba(244,185,29,.2);border-radius:10px;background:#0a0906}.receipt-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:9px}.receipt-title b{font-size:10px}.receipt-title small{font-size:7px;color:#777}.receipt-box input[type=file]{display:block;width:100%;font-size:8px;color:#999;margin-bottom:9px}.receipt-box input[type=file]::file-selector-button{border:1px solid #3a3019;background:#171105;color:#e9c24c;border-radius:6px;padding:7px 9px;margin-right:8px;font-size:8px;font-weight:800;cursor:pointer}.receipt-box button,.check-status{border:1px solid rgba(244,185,29,.3);background:#151006;color:#efc64e;border-radius:7px;padding:8px 11px;font-size:8px;font-weight:900;cursor:pointer}.receipt-box button:disabled{opacity:.55;cursor:wait}.receipt-status{margin-top:8px;color:#9f987e;font-size:8px;min-height:11px}.check-status{width:100%;margin-top:4px}.check-status:hover,.receipt-box button:hover{border-color:#efc23d;background:#211805}

/* V17 — polished donation form typography & alignment */
.donation label{
  margin:15px 0 8px;
  color:#e7e3dc;
  font-size:11px;
  font-weight:950;
  letter-spacing:.15px;
  line-height:1.2;
}
.donation label em{
  color:#8f887d;
  font-size:9px;
  font-weight:800;
  margin-left:3px;
}
.donation .money{
  height:48px;
  border-radius:10px;
  border-color:#2b2925;
}
.donation .money>span{
  padding:0 8px 0 16px;
  color:#f0c44d;
  font-size:16px;
  font-weight:950;
  line-height:1;
  align-items:center;
  justify-content:center;
}
.donation .money input{
  height:100%;
  padding:0 14px 0 3px;
  font-size:17px;
  font-weight:950;
  line-height:normal;
  display:flex;
  align-items:center;
}
.donation .input{
  height:48px;
  border-radius:10px;
  padding:0 14px;
  font-size:14px;
  font-weight:800;
  color:#f2f0eb;
}
.donation .input::placeholder{
  color:#77736c;
  opacity:1;
  font-weight:650;
}
.donation textarea.input.message{
  height:82px;
  padding:13px 14px;
  font-size:13px;
  font-weight:750;
  line-height:1.4;
}
.donation .amounts button{
  font-size:11px;
}

/* V18 — reference-inspired premium form scale */
.donation label{
  margin:16px 0 8px;
  font-size:13px;
  font-weight:950;
  letter-spacing:.05px;
  color:#f0ece4;
}
.donation label em{
  font-size:9px;
  font-weight:800;
  color:#a49b8d;
  margin-left:4px;
}
.donation .money{
  height:52px;
  border-radius:11px;
  display:flex;
  align-items:center;
  overflow:hidden;
}
.donation .money>span{
  display:flex;
  align-items:center;
  justify-content:center;
  height:100%;
  padding:0 9px 0 17px;
  color:#ffd45a;
  font-size:17px;
  font-weight:950;
  line-height:1;
}
.donation .money input{
  flex:1;
  min-width:0;
  height:100%;
  padding:0 14px 0 3px;
  font-size:19px;
  font-weight:950;
  color:#fffdf8;
  line-height:1;
  text-align:left;
  display:block;
}
.donation .input{
  height:52px;
  border-radius:11px;
  padding:0 15px;
  font-size:15px;
  font-weight:800;
  color:#f5f2ec;
}
.donation .input::placeholder{
  color:#858078;
  opacity:1;
  font-size:14px;
  font-weight:650;
}
.donation textarea.input.message{
  height:86px;
  padding:14px 15px;
  font-size:14px;
  font-weight:750;
  line-height:1.45;
}
.donation .amounts button{
  font-size:12px;
  font-weight:900;
  height:46px;
}

/* Persistent customer payment state */
.result-done{margin-top:16px;width:100%;min-height:46px;border:1px solid rgba(245,190,30,.7);border-radius:12px;background:linear-gradient(135deg,#c89400,#ffd65a);color:#090909;font-weight:900;letter-spacing:.3px;cursor:pointer;box-shadow:0 8px 24px rgba(245,190,30,.16)}
.result-done:hover{filter:brightness(1.06);transform:translateY(-1px)}
.result-actions{display:flex;gap:10px;margin-top:14px}
.result-actions .result-done,.result-actions #tryAgain{flex:1;margin-top:0}

/* Receipt lock state */
#receipt:disabled{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:none;
}
#receipt:disabled::file-selector-button{
  opacity:.55;
  cursor:not-allowed;
}

/* V23 — premium UI polish */
.donation.payment-active > .card-title,
.donation.payment-active > .amounts,
.donation.payment-active > label,
.donation.payment-active > .input,
.donation.payment-active > .donate,
.donation.payment-active > .manual-note{
  display:none;
}
.donation.payment-active{padding-bottom:18px}
.donation.payment-active .payment-panel{margin-top:0}

/* Browser autofill stays inside the SIMONX theme */
.donation input:-webkit-autofill,
.donation input:-webkit-autofill:hover,
.donation input:-webkit-autofill:focus,
.donation textarea:-webkit-autofill,
.donation textarea:-webkit-autofill:hover,
.donation textarea:-webkit-autofill:focus{
  -webkit-text-fill-color:#f5f2ec!important;
  -webkit-box-shadow:0 0 0 1000px #070706 inset!important;
  box-shadow:0 0 0 1000px #070706 inset!important;
  caret-color:#fff;
  transition:background-color 9999s ease-out 0s;
}

/* Payment progress */
.payment-status-steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  margin:12px 0 5px;
}
.status-step{
  position:relative;
  min-height:54px;
  padding:7px 6px 6px 29px;
  border:1px solid #24211b;
  border-radius:8px;
  background:#090907;
  opacity:.58;
}
.status-step>span{
  position:absolute;left:7px;top:8px;width:17px;height:17px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid #484238;color:#777;font-size:8px;font-weight:900;
}
.status-step b{display:block;color:#8f897e;font-size:7.5px;line-height:1.1}
.status-step small{display:block;color:#57534c;font-size:6px;line-height:1.15;margin-top:3px}
.status-step.active{opacity:1;border-color:rgba(230,179,31,.22)}
.status-step.active>span{border-color:#d9aa28;color:#f2c84d}
.status-step.current{background:linear-gradient(180deg,#171208,#0a0906);box-shadow:inset 0 0 14px rgba(238,184,30,.04)}
.status-step.current b{color:#f0c74e}
.status-step.complete>span{background:#1a1609;color:#f0c74e}

/* Cleaner success / failed result cards */
.result-panel{margin-top:14px;border-radius:14px}
.success-panel,.fail-panel{padding:22px 18px 18px}
.success-panel .result-icon,.fail-panel .result-icon{width:48px;height:48px;margin:0 auto 12px;font-size:25px}
.success-panel>small,.fail-panel>small{font-size:8px;letter-spacing:2px}
.success-panel h3,.fail-panel h3{font-size:15px;margin:8px 0 5px}
.success-panel>strong{font-size:27px}

/* Goal hierarchy */
.goal .goal-total{font-size:25px;font-weight:950}
.goal .goal-total span{font-size:9px;color:#77716a;font-weight:700}
.goal .progress{height:8px;border-radius:99px;overflow:hidden}
.goal .progress i{display:block;height:100%;width:30%;border-radius:99px;background:linear-gradient(90deg,#dca500,#ffd85e);box-shadow:0 0 12px rgba(244,185,29,.22)}
.goal p{font-size:7px;color:#77716a}

/* CTA refinement */
.donate{min-height:50px;box-shadow:0 8px 24px rgba(238,177,20,.12);transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.donate:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 10px 28px rgba(238,177,20,.2)}
.donate b{display:inline-block;transition:transform .18s ease}
.donate:hover b{transform:translateX(4px)}

@media(max-width:720px){
  .payment-status-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .payment-status-steps{grid-template-columns:1fr 1fr}
  .status-step{min-height:48px}
}

/* V25 receipt upload state polish */
#receipt:disabled{opacity:.48;cursor:not-allowed}
#submitReceipt:disabled{opacity:.62;cursor:not-allowed}

/* V26 navigation + safe return-to-donation flow */
.nav-links{display:flex;align-items:center;gap:5px;margin-left:auto;margin-right:14px}
.nav-links button{border:1px solid transparent;background:transparent;color:#aaa;font-size:8px;font-weight:900;letter-spacing:1.5px;padding:7px 10px;border-radius:7px;cursor:pointer}
.nav-links button:hover{color:#fff;border-color:rgba(244,185,29,.28);background:rgba(244,185,29,.06)}
.resume-banner{display:flex;align-items:center;gap:10px;margin:0 0 13px;padding:10px 12px;border:1px solid rgba(244,185,29,.22);border-radius:9px;background:rgba(20,15,5,.75)}
.resume-banner>span{color:#f4b91d;font-size:9px;box-shadow:0 0 10px rgba(244,185,29,.35)}
.resume-banner div{flex:1}
.resume-banner b{display:block;font-size:9px;color:#eee}
.resume-banner small{display:block;margin-top:2px;color:#777168;font-size:7px}
.resume-banner button{border:1px solid rgba(244,185,29,.45);background:#161105;color:#f3c64e;border-radius:6px;padding:7px 9px;font-size:7px;font-weight:950;cursor:pointer}
.resume-banner button:hover{background:#2a2109}
.back-donation{width:100%;height:36px;margin-top:10px;border:1px solid rgba(244,185,29,.2);border-radius:8px;background:#080806;color:#cdbb83;font-size:8px;font-weight:900;letter-spacing:.5px;cursor:pointer}
.back-donation:hover{border-color:rgba(244,185,29,.55);color:#fff;background:#100d06}
.hidden{display:none!important}
@media(max-width:760px){
  .nav-links{margin-left:auto;margin-right:7px;gap:2px}
  .nav-links button{font-size:7px;padding:6px 6px;letter-spacing:1px}
  .live{padding:6px 8px;font-size:7px}
}

/* V27 — dedicated SIMONX home / landing page */
.home-page{padding-bottom:28px}
.home-hero{text-align:center;max-width:760px;margin:10px auto 22px;padding:42px 20px 28px}
.home-kicker{font-size:9px;letter-spacing:3px;color:#d8b64b;font-weight:950;margin-bottom:14px}
.home-hero h1{font-size:clamp(34px,5vw,58px);line-height:1.02;margin:0 0 12px}
.home-hero h1 b{color:#f5c94f}
.home-hero p{max-width:590px;margin:0 auto;color:#aaa49a;font-size:12px;line-height:1.7}
.home-actions{display:flex;justify-content:center;gap:9px;margin-top:22px}
.home-actions button,.home-cta button{height:43px;border-radius:9px;padding:0 18px;font-size:9px;font-weight:950;letter-spacing:.5px;cursor:pointer}
.home-primary,.home-cta button{border:1px solid #f4b91d;background:linear-gradient(110deg,#d99609,#ffd75d);color:#090806;box-shadow:0 8px 24px rgba(244,185,29,.15)}
.home-primary span,.home-cta button span{margin-left:25px}
.home-secondary{border:1px solid rgba(244,185,29,.25);background:rgba(4,4,4,.75);color:#c9c3b8}
.home-actions button:hover,.home-cta button:hover{transform:translateY(-1px);filter:brightness(1.06)}
.home-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:12px;max-width:1100px;margin:0 auto}
.home-card{border:1px solid rgba(244,185,29,.2);border-radius:13px;background:rgba(5,5,5,.82);padding:18px;box-shadow:0 16px 35px rgba(0,0,0,.35)}
.home-card-head{display:flex;align-items:center;gap:7px;color:#d4b84e;font-size:8px;letter-spacing:1.5px;font-weight:950}
.home-card-head span{color:#f4b91d}
.home-card-head b{margin-left:auto;font-size:8px;color:#f4c846}
.home-card h2{font-size:17px;margin:14px 0 7px}
.home-card p{font-size:9px;line-height:1.65;color:#827d74;margin:0 0 14px}
.home-card button{border:0;background:none;color:#e8bf42;font-size:8px;font-weight:950;cursor:pointer;padding:0}
.home-goal-total{font-size:25px;font-weight:950;margin:18px 0 10px}
.home-goal-total span{font-size:9px;color:#68635a;font-weight:700}
.home-progress{height:7px;border-radius:99px;background:#17140d;overflow:hidden;margin-bottom:7px}
.home-progress i{display:block;width:30%;height:100%;background:linear-gradient(90deg,#d9950b,#ffe27b);border-radius:99px}
.home-card>small{font-size:7px;color:#666158}
.home-section-title{max-width:1100px;margin:30px auto 13px}
.home-section-title small{font-size:8px;letter-spacing:2px;color:#c9a943;font-weight:950}
.home-section-title h2{font-size:20px;margin:5px 0 0}
.support-reasons{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;max-width:1100px;margin:auto}
.support-reasons>div{padding:15px;border:1px solid rgba(244,185,29,.16);border-radius:10px;background:rgba(5,5,5,.75)}
.support-reasons span{display:block;color:#f4b91d;font-size:18px;margin-bottom:9px}
.support-reasons b{display:block;font-size:10px}
.support-reasons small{display:block;color:#706b62;font-size:7px;line-height:1.45;margin-top:4px}
.supporters-title{margin-top:34px;text-align:center}.supporters-title small{font-size:10px;letter-spacing:3px;color:#bda65e;font-weight:950}.supporters-title h2{font-size:24px;line-height:1.15;margin:8px 0 0;font-weight:950;letter-spacing:.2px}.supporters-title p{margin:9px 0 0;color:#8b8479;font-size:10px;letter-spacing:.25px}.home-supporters{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:1100px;margin:14px auto 0}.home-supporters>div.supporter-card{position:relative;min-height:88px;padding:16px 15px 14px 42px;border:1px solid rgba(244,185,29,.18);border-radius:13px;background:linear-gradient(145deg,rgba(14,12,8,.92),rgba(4,4,4,.9));box-shadow:inset 0 1px rgba(255,255,255,.035),0 12px 28px rgba(0,0,0,.25);overflow:hidden}.home-supporters>div.supporter-card:before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:linear-gradient(180deg,#f6c33b,#7d5b13);box-shadow:0 0 14px rgba(244,185,29,.22)}.supporter-rank{position:absolute;left:13px;top:12px;color:#6e6658!important;font-size:8px!important;font-weight:900;letter-spacing:1px}.supporter-crown{position:absolute;left:12px;bottom:13px;color:#e4b735!important;font-size:16px!important;text-shadow:0 0 12px rgba(244,185,29,.28)}.supporter-info{min-width:0;padding-right:5px}.supporter-info b{display:block;font-size:13px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.15px}.supporter-info small{display:block;margin-top:6px;color:#716b61;font-size:7px;letter-spacing:.3px}.home-supporters>div.supporter-card>strong{display:block;margin-top:10px;color:#f4c33f;font-size:17px;font-weight:950;letter-spacing:.3px;text-align:right}.home-supporters .support-empty{grid-column:1/-1;padding:25px;text-align:center;display:flex!important;flex-direction:column;gap:5px;border:1px solid rgba(244,185,29,.16)!important;border-radius:12px;background:rgba(5,5,5,.75)}.home-supporters .support-empty span{font-size:20px;color:#e4b735}.home-supporters .support-empty b{font-size:11px}.home-supporters .support-empty small{font-size:8px;color:#666}
.home-cta{max-width:1100px;margin:28px auto 0;padding:25px;text-align:center;border:1px solid rgba(244,185,29,.24);border-radius:13px;background:linear-gradient(145deg,rgba(23,17,5,.8),rgba(4,4,4,.85))}
.home-cta small{font-size:8px;letter-spacing:2px;color:#c6a640;font-weight:950}
.home-cta h2{font-size:24px;margin:7px 0}
.home-cta p{font-size:9px;color:#777168;margin:0 auto 15px}
.hidden{display:none!important}
@media(max-width:760px){
 .home-grid,.support-reasons{grid-template-columns:1fr}
 .home-supporters{grid-template-columns:1fr 1fr}
 .home-supporters>div.supporter-card{min-height:84px}
 .home-hero{padding-top:25px}
 .home-actions{flex-direction:column;max-width:300px;margin-left:auto;margin-right:auto}
}

/* V28 desktop scale polish */
@media (min-width:1100px){
  main{padding-left:22px;padding-right:22px}
}

/* V29 readability + payment session timer */
label{font-size:12px!important;color:#d4cec2!important;margin-top:15px!important;margin-bottom:8px!important}
label em{font-size:9px!important;color:#8e877a!important}
.mini b{font-size:11px!important}.mini small{font-size:9px!important}
.card-title h2{font-size:16px!important}.card-title small{font-size:10px!important}
.amounts button{font-size:11px!important}
.method b{font-size:11px!important}.method small{font-size:8px!important}
.method-title b{font-size:12px!important}.method-title small{font-size:8px!important}
.pay-total span,.pay-ref span{font-size:9px!important}.pay-total b{font-size:15px!important}.pay-ref b{font-size:10px!important}
.steps-title{font-size:9px!important}.pay-step p{font-size:10px!important;line-height:1.4!important}.pay-step>span{font-size:9px!important}
.waiting-line{font-size:9px!important}
.status-step b{font-size:9px!important}.status-step small{font-size:7px!important}
.check-status{font-size:9px!important}
.receipt-title b{font-size:12px!important}.receipt-title small{font-size:8px!important}
.receipt-box input[type=file]{font-size:9px!important}.receipt-box input[type=file]::file-selector-button{font-size:9px!important}
.receipt-status{font-size:9px!important}
.payment-head-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.payment-timer{min-width:48px;text-align:center;color:#f6c94d;border:1px solid rgba(244,185,29,.3);background:rgba(244,185,29,.06);border-radius:999px;padding:6px 8px;font-size:9px;font-weight:950;letter-spacing:1px}
.payment-timer.urgent{color:#ff9c75;border-color:rgba(255,120,80,.5);background:rgba(255,80,40,.08);animation:timerPulse 1s infinite}
@keyframes timerPulse{50%{box-shadow:0 0 12px rgba(255,100,60,.2)}}
.thank-you{font-size:11px!important;line-height:1.65!important;color:#d8caa7!important;margin:10px auto 7px!important}
.success-panel p:not(.thank-you){font-size:8px!important}
@media(max-width:760px){
 .payment-head-right{gap:5px}.payment-timer{font-size:8px;padding:5px 7px}
 label{font-size:11px!important}.pay-step p{font-size:9px!important}
}

/* V30 — premium payment countdown display */
.payment-head-right{gap:12px!important;align-items:center}
.timer-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.timer-wrap small{font-size:6px!important;letter-spacing:1.6px;color:#777168!important;font-weight:900!important}
.payment-timer{
  min-width:66px!important;
  padding:5px 10px!important;
  font-size:12px!important;
  line-height:1!important;
  letter-spacing:1.5px!important;
  color:#f7ce57!important;
  border:1px solid rgba(244,185,29,.38)!important;
  background:linear-gradient(180deg,rgba(244,185,29,.09),rgba(244,185,29,.025))!important;
  box-shadow:inset 0 0 12px rgba(244,185,29,.035),0 0 12px rgba(244,185,29,.04);
}
.payment-timer.urgent{
  color:#ff9a78!important;
  border-color:rgba(255,105,70,.55)!important;
  background:rgba(255,80,40,.09)!important;
}
@media(max-width:600px){
 .payment-head-right{gap:7px!important}
 .timer-wrap small{font-size:5px!important}
 .payment-timer{min-width:58px!important;font-size:10px!important;padding:5px 7px!important}
}

/* V31 — explicit cancel-payment return action */
.back-donation{color:#bda967!important}
.back-donation:hover{color:#ffd75d!important;border-color:rgba(244,185,29,.6)!important}

/* V32 — premium cancel-payment confirmation modal */
.cancel-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
.cancel-modal.hidden{display:none!important}
.cancel-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(5px)}
.cancel-modal-card{position:relative;width:min(430px,calc(100vw - 36px));padding:25px;border:1px solid rgba(244,185,29,.38);border-radius:16px;background:linear-gradient(145deg,#15130d,#080807 70%);box-shadow:0 24px 70px rgba(0,0,0,.65),0 0 35px rgba(244,185,29,.08);text-align:left;animation:cancelModalIn .16s ease-out}
.cancel-modal-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:13px;border:1px solid rgba(244,185,29,.45);background:rgba(244,185,29,.08);color:#f5c94f;font-size:18px;font-weight:950}
.cancel-modal-kicker{font-size:8px;letter-spacing:2px;color:#d6b548;font-weight:950;margin-bottom:7px}
.cancel-modal-card h3{font-size:20px;color:#fff;margin:0 0 8px}
.cancel-modal-card p{font-size:10px;line-height:1.65;color:#989186;margin:0 0 16px}
.cancel-modal-info{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;margin-bottom:17px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.025)}
.cancel-modal-info span{font-size:7px;letter-spacing:1.4px;color:#777168;font-weight:900}
.cancel-modal-info b{font-size:12px;letter-spacing:1px;color:#f5c94f}
.cancel-modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cancel-modal-actions button{height:40px;border-radius:8px;font-size:8px;font-weight:950;letter-spacing:.5px;cursor:pointer}
#cancelStay{border:1px solid rgba(244,185,29,.3);background:#11100b;color:#e7d9b1}
#cancelStay:hover{border-color:#f4b91d;color:#fff}
#cancelConfirm{border:1px solid #d49c13;background:linear-gradient(110deg,#c98d0a,#f6c94e);color:#090806}
#cancelConfirm:hover{filter:brightness(1.08)}
@keyframes cancelModalIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:520px){.cancel-modal-card{padding:21px}.cancel-modal-actions{grid-template-columns:1fr}.cancel-modal-card h3{font-size:18px}}

/* V34 — explicit continue-payment behavior */
#cancelStay:active{transform:translateY(1px)}
#cancelConfirm:active{transform:translateY(1px)}

.support-empty{grid-column:1/-1;padding:24px;text-align:center;display:flex!important;flex-direction:column;gap:5px;border-right:0!important}.support-empty span{font-size:20px}.support-empty b{font-size:11px}.support-empty small{font-size:8px;color:#666}

/* V37.4 — SIMONX themed video message uploader */
.video-message-box{margin-top:16px;padding:16px 16px 14px;border:1px solid rgba(244,185,29,.32);border-radius:12px;background:linear-gradient(145deg,rgba(28,21,7,.94),rgba(5,5,5,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 28px rgba(0,0,0,.28)}
.video-message-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.video-message-title{display:flex;align-items:center;gap:10px;min-width:0}
.video-message-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center;flex:0 0 30px;border:1px solid rgba(244,185,29,.45);border-radius:8px;background:linear-gradient(145deg,rgba(244,185,29,.17),rgba(244,185,29,.035));color:#ffd45c;font-size:11px;box-shadow:0 0 18px rgba(244,185,29,.08)}
.video-message-title b{display:block!important;font-size:12px!important;line-height:1.1!important;letter-spacing:.9px;color:#f4c94f!important;font-weight:950!important}
.video-message-title small{display:block!important;margin-top:4px;color:#a49b8a!important;font-size:9px!important;line-height:1.35!important;font-weight:500!important}
.video-limit-badge{flex:none;padding:6px 9px;border:1px solid rgba(244,185,29,.28);border-radius:999px;background:rgba(244,185,29,.06);color:#e0c476;font-size:8px;font-weight:900;letter-spacing:1px}
.video-upload-wrap{position:relative;margin-top:2px}
/* Hide the native file control robustly, even if another global input rule exists. */
.video-file-input{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;opacity:0!important;pointer-events:none!important}
.video-upload-btn{box-sizing:border-box!important;width:100%!important;min-height:48px!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;padding:0 15px!important;border:1px dashed rgba(244,185,29,.55)!important;border-radius:9px!important;background:linear-gradient(180deg,rgba(244,185,29,.10),rgba(244,185,29,.025))!important;color:#f0d276!important;font-size:10px!important;font-weight:950!important;letter-spacing:1.1px!important;cursor:pointer!important;transition:all .18s ease!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important}
.video-upload-btn:hover{border-color:rgba(244,185,29,.9)!important;background:linear-gradient(180deg,rgba(244,185,29,.16),rgba(244,185,29,.045))!important;color:#fff!important;transform:translateY(-1px)}
.video-upload-plus{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(244,185,29,.42);border-radius:6px;background:rgba(244,185,29,.08);color:#ffd04a;font-size:15px;line-height:1}
.video-message-status{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px;margin-top:9px!important;padding:8px 10px!important;border:1px solid rgba(255,255,255,.07)!important;border-radius:7px!important;background:rgba(255,255,255,.018)!important;color:#837b6d!important;font-size:8px!important;line-height:1.2!important;letter-spacing:.2px!important;min-height:16px}
.video-message-status .video-status-main{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:78%}
.video-message-status .video-status-limit{color:#b49a5a!important;font-weight:900;white-space:nowrap}
.video-message-status.is-selected{border-color:rgba(244,185,29,.24)!important;color:#dfc477!important;background:rgba(244,185,29,.035)!important}
.video-message-status.is-selected .video-status-limit{color:#f0c84d!important}
.video-message-status.is-error{border-color:rgba(255,90,70,.55)!important;background:rgba(120,20,12,.10)!important;color:#ff9b8c!important}.video-message-status.is-error .video-status-limit{color:#ff806e!important}
@media(max-width:520px){.video-message-box{padding:13px}.video-message-title b{font-size:10px!important}.video-message-title small{font-size:7px!important}.video-limit-badge{font-size:6px;padding:5px 7px}.video-upload-btn{min-height:44px!important;font-size:8px!important}.video-message-status{font-size:7px!important}}

/* V37.6 - Dashboard managed real payment QR */
.payment-qr-image{width:145px;height:145px;object-fit:contain;display:block;position:absolute;inset:0;margin:auto;background:#fff;z-index:5}.fake-qr.has-real-qr{background:#fff;border:0;box-shadow:none}.fake-qr.has-real-qr:after,.fake-qr.has-real-qr:before{display:none}.fake-qr.has-real-qr .finder,.fake-qr.has-real-qr .qr-noise{display:none}

/* V37.7 - Never show a fake/demo QR. Keep the exact QR slot size and reveal only a dashboard-uploaded QR. */
.fake-qr{
  width:145px;
  height:145px;
  position:relative;
  background:#fff !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:hidden;
}
.fake-qr::before,
.fake-qr::after,
.fake-qr .finder,
.fake-qr .qr-noise,
.fake-qr span{
  display:none !important;
}
.payment-qr-image.hidden{display:none !important;}
.payment-qr-image:not(.hidden){display:block !important;}

.maintenance-banner{max-width:1100px;margin:10px auto 0;padding:12px 16px;text-align:center;border:1px solid rgba(244,185,29,.35);border-radius:12px;background:rgba(20,16,7,.9);color:#f1c34d;font-size:10px;font-weight:900;letter-spacing:1.2px}.maintenance-banner.hidden{display:none}
/* V40.5 - Real QR only: remove all legacy fake QR artwork/markup. */
.qr-visual{width:180px;height:180px;position:relative;display:flex;align-items:center;justify-content:center;background:#fff;border:0;box-shadow:none;overflow:hidden;}
.qr-visual .payment-qr-image{position:static;inset:auto;width:180px;height:180px;max-width:100%;max-height:100%;object-fit:contain;background:#fff;display:block;}
.qr-visual .payment-qr-image.hidden{display:none!important;}
@media(max-width:620px){.qr-visual,.qr-visual .payment-qr-image{width:180px;height:180px;}}


/* V40.6 - QR display: large, clean and scan-friendly. */
.qr-visual{width:220px!important;height:220px!important;padding:0!important;overflow:hidden!important;background:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:11px!important;}
.qr-visual .payment-qr-image{width:220px!important;height:220px!important;max-width:220px!important;max-height:220px!important;object-fit:contain!important;position:static!important;margin:0!important;background:#fff!important;display:block!important;}
.qr-visual .payment-qr-image.hidden{display:none!important;}
@media(max-width:620px){.qr-visual{width:210px!important;height:210px!important}.qr-visual .payment-qr-image{width:210px!important;height:210px!important;max-width:210px!important;max-height:210px!important}}

/* V40.7 - hard QR slot: every uploaded image is displayed inside the same 180x180 demo frame. */
.qr-visual{width:180px!important;height:180px!important;min-width:180px!important;min-height:180px!important;max-width:180px!important;max-height:180px!important;overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;background:#fff!important;box-sizing:border-box!important;}
.qr-visual .payment-qr-image{width:180px!important;height:180px!important;min-width:0!important;min-height:0!important;max-width:180px!important;max-height:180px!important;object-fit:contain!important;object-position:center!important;position:static!important;margin:0!important;padding:0!important;display:block!important;box-sizing:border-box!important;}
