@charset "UTF-8";
html{}
body{font:var(--SiteFS,12px)/1.5 var(--SiteFF2),'Arial',sans-serif;font-weight:600;margin:0;background:var(--body-background-color,hsl(0 0% 97%));color:var(--body-text-color,rgba(0 0 0/75%));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;word-break:break-word;}
input,textarea,select{font-size:1em;color:#555;font-family:var(--SiteFF2);font-weight:600;}
h1,h2,h3,h4,h5,h6,ul,ol{margin:0;}
h1,h2,h3{font-family:var(--SiteFF);font-weight:600;}
ul,ol,menu{padding-inline-start:0;padding-inline-start:0;}
li{list-style-type:none;}
form,dl,dd,menu{margin:0;}
a img{border:none;}
a{color:var(--SiteTHM);text-decoration:none;-webkit-tap-highlight-color:transparent;outline:none;}

/*fonts*/
/*Manrope*/
@font-face{font-family:'Manrope';font-style:normal;font-weight:200;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/200.woff') format('woff');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/300.woff') format('woff');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/400.woff') format('woff');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/500.woff') format('woff');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/600.woff') format('woff');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/700.woff') format('woff');}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/manrope/v13/manrope.woff2') format('woff2'),url('../fonts/manrope/v13/800.woff') format('woff');}
@supports(font-variation-settings:normal){
	@font-face{font-family:'Manrope';src:url('../fonts/manrope/v13/manrope.woff2') format('woff2 supports variations'),url('../fonts/manrope/v13/manrope.woff2') format('woff2-variations');font-weight:200 800;font-stretch:25% 151%;font-style:normal;font-display:swap;}
}
/*Spline Sans Mono*/
@font-face{font-family:'Spline Sans Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/splinesansmono/v8/splinesansmono.woff2') format('woff2'),url('../fonts/splinesansmono/v8/400.woff') format('woff');}
@font-face{font-family:'Spline Sans Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/splinesansmono/v8/splinesansmono.woff2') format('woff2'),url('../fonts/splinesansmono/v8/600.woff') format('woff');}
@font-face{font-family:'Spline Sans Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/splinesansmono/v8/splinesansmono.woff2') format('woff2'),url('../fonts/splinesansmono/v8/700.woff') format('woff');}

/* Noto Sans Arabic */
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:100;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/100.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:200;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/200.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:300;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/300.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:400;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/400.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/500.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:600;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/600.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:700;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/700.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:800;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/800.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:900;font-stretch:100%;font-display:swap;src:url('../fonts/notosansarabic/v18/notosansarabic.woff2') format('woff2'),url('../fonts/notosansarabic/v18/900.woff') format('woff');unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC,U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/*variables*/
:root{
	--CPT-TST:var(--SiteTST);
	--CPT-FF:"Manrope","Arial","PingFang",system-ui,sans-serif;

	--SiteTHM:var(--CPT-THM);
	--SiteTHM-A0:rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B)/0);
	--SiteTHM-A5:rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B)/5%);
	--SiteTHM-A10:rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B)/10%);
	--SiteTHM-A25:rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B)/25%);
	--SiteTHM-A50:rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B)/50%);
	--SiteTHM-A75:rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B)/75%);

	--SiteTST:all ease .2s;
	--IconFF: var(--IconFF3);

	--background-color-warning: rgba(255 255 0/10%);
	--text-color-warning: rgba(255 255 0);
	--background-color-alert: rgba(255 50 50/25%);
	--text-color-alert: rgba(255 70 70);
	--background-color-complete: rgba(0 128 0/10%);
	--text-color-complete: rgba(0 128 0);

	--background-color-promotion: rgba(0 128 0/10%);
	--text-color-promotion: rgba(0 128 0);
}
.cpt-select option {
	color: var(--body-text-color);
	background: var(--background-color-L1);
}
.btw{--font-weight:800;}
.btw[color=theme] {
    background-image: linear-gradient(calc(135deg * var(--angle-reverse,1)),hsl(calc(var(--CPT-THM-H) - 5) var(--CPT-THM-S) var(--CPT-THM-L)),hsl(calc(var(--CPT-THM-H) + 5) var(--CPT-THM-S) var(--CPT-THM-L)));
}
/*全局字体变量*/
:root{

	/*标题字体*/
	--font-family-heading-1: "Manrope";
	--font-family-heading-2: "Montserrat";
	--font-family-heading-3: "Readex Pro";
	/*普通字体*/
	--font-family-content-1: "Manrope";
	/*MONO*/
	--font-family-mono-1: "Spline Sans Mono";

	/*标题字体*/
	--SiteFF:var(--font-family-heading-1, ""), "Arial",system-ui,sans-serif;
	--SiteFF3:var(--font-family-heading-2, ""), "Arial",system-ui,sans-serif;
	--SiteFF4:var(--font-family-heading-3, ""), "Arial",system-ui,sans-serif;
	/*普通字体*/
	--SiteFF2:var(--font-family-content-1, ""), "Arial",system-ui,sans-serif;
	/*MONO*/
	--SiteFF5:var(--font-family-mono-1, ""), "monospace",system-ui,sans-serif;
}

body{
	--VWX:calc(var(--VW) * 1px);
	--VHX:calc(var(--VH) * 1px);
	--VWidth:var(--VWX,100vw);
	--VHeight:var(--VHX,100vh);

	--MaxContentWidth: 100em;
}
@media only screen and (max-width:1280px){
	body{--MaxContentWidth: 83.333334em;}
}
@media only screen and (max-width:1000px){
	body{--MaxContentWidth: 100%;}
}

/*rtl*/
[lang*="ar"]{
	direction:rtl;
	--inline-start:right;
	--inline-end:left;

	--translate-reverse:-1;
	--angle-reverse:-1;

	/*标题字体*/
	--font-family-heading-1: "Manrope","Noto Sans Arabic";
	--font-family-heading-2: "Montserrat","Noto Sans Arabic";
	--font-family-heading-3: "Noto Sans Arabic";
	/*普通字体*/
	--font-family-content-1: "Manrope","Noto Sans Arabic";

	--CPT-FF: "Manrope","Noto Sans Arabic","Arial",system-ui,sans-serif;
}

[lang*="ar"] [icon="sort"]::before,
[lang*="ar"] [icon="search"]::before,
[lang*="ar"] [icon-only="search"]::before,
[lang*="ar"] [icon-only="logout"]::before,
[lang*="ar"] [icon="navigate_before"]::before,
[lang*="ar"] [icon-only="navigate_before"]::before,
[lang*="ar"] [icon="navigate_next"]::before,
[lang*="ar"] [icon-only="navigate_next"]::before,
[lang*="ar"] [icon="chevron_left"]::before,
[lang*="ar"] [icon-only="chevron_left"]::before,
[lang*="ar"] [icon="chevron_right"]::before,
[lang*="ar"] [icon-only="chevron_right"]::before,
[lang*="ar"] [icon="send"]::before,
[lang*="ar"] [icon-only="send"]::before,
[lang*="ar"] [icon="logout"]::before,
[lang*="ar"] [icon-only="logout"]::before{transform:scaleX(-1);}



/* theme */
[data-theme="hitpoints"] {
	--CPT-THM-R: 102;
	--CPT-THM-G: 51;
	--CPT-THM-B: 153;
	--CPT-THM-H: 270;
	--CPT-THM-S: 50%;
	--CPT-THM-L: 40%;
}
[data-theme="kaleoz"] {
	--CPT-THM-R: 30;
	--CPT-THM-G: 144;
	--CPT-THM-B: 255;
	--CPT-THM-H: 210;
	--CPT-THM-S: 100%;
	--CPT-THM-L: 56%;
}
[data-theme="seagmpin"] {
	--CPT-THM-R: 255;
	--CPT-THM-G: 69;
	--CPT-THM-B: 0;
	--CPT-THM-H: 16;
	--CPT-THM-S: 100%;
	--CPT-THM-L: 50%;
}


/*layout*/
body{display:flex;flex-direction:column;justify-content:flex-start;min-width:320px;min-height:var(--VHeight);word-break:break-word;}

#vue{flex:auto;display:flex;flex-direction:column;}


/* footer */
#footer{}
#footer>.inner{width:100%;max-width:var(--MaxContentWidth);margin-inline:auto;padding:2em;box-sizing:border-box;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1em 2em;}
#footer .copyright{text-align:center;}
#footer .copyright a{color:currentColor;font-weight:800;}
#footer .nav{display:flex;flex-wrap:wrap;gap:1em;}
#footer .nav a{font-weight:800;}
#footer .language{width:fit-content;margin-inline:auto;}
@media only screen and (max-width:1000px){
	#footer>.inner{grid-template-columns:1fr;max-width:40em;padding-inline:1.5em;}
	#footer .nav{justify-content:center;order:9;}
}



/* web sdk */
#sdk_content{margin-block:auto;}
#sdk_content>.inner{width:100%;max-width:var(--MaxContentWidth);margin-inline:auto;padding:2em;box-sizing:border-box;display:grid;grid-template-columns:clamp(25em,35%,30em) 1fr;align-items:start;gap:2em;}

#Transaction_info,
#Redeem_container{padding:3em;background:var(--background-color-L1,#fff);border-radius:1em;}

#Transaction_info{}
#Transaction_info>.inner{max-width:25em;margin-inline:auto;display:flex;flex-direction:column;gap:2em;}
#Transaction_info .merchant{display:flex;align-items:center;justify-content:space-between;gap:2em;box-shadow:var(--body-text-color-a10,rgba(0 0 0/5%)) 0 1px 0;min-height: 5em;padding-block-end: 2em;box-sizing:border-box;}
#Transaction_info .merchant .logo{height:2.5em;min-width:2.5em;max-width:10em;}
#Transaction_info .merchant .logo img{vertical-align:top;width:100%;height:100%;object-fit:contain;}
#Transaction_info .info{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:1em 2em;}
#Transaction_info .info .T{}
#Transaction_info .info .C{text-align:end;font-weight:800;}
#Transaction_info .expiry{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:1em 2em;}
#Transaction_info .expiry .T{}
#Transaction_info .expiry .C{white-space:nowrap;text-align:end;font-weight:800;}
#Transaction_info .countdown{display:flex;align-items:center;justify-content:end;gap:.5em;}
#Transaction_info .countdown::before{content:attr(icon);display:block;font-size:1.5em;width:1em;height:1em;line-height:1;overflow:hidden;opacity:.5;}
#Transaction_info .countdown>div{display:flex;align-items:center;gap:.5em;}
#Transaction_info .countdown>div::after{content:attr(class);font-weight:600;opacity:.5;}

#Redeem_container{}
#Redeem_container>.inner{max-width:40em;margin-inline:auto;display:flex;flex-direction:column;gap:2em;}
#Redeem_container .title{box-shadow:var(--body-text-color-a10,rgba(0 0 0/5%)) 0 1px 0;min-height:5em;padding-block-end:2em;box-sizing:border-box;display:grid;grid-template-columns:1fr auto;gap:1em;align-items:center;}
#Redeem_container .Pin_logo{background:var(--pin-logo,url('../images/placeholder/blank.svg')) no-repeat var(--inline-start,left) center/contain;color:transparent;height:var(--pin-logo-height);grid-column:1/2;}
.Pin_logo.hitpoints{--pin-logo:url('../images/pin_logo/hitpoints.svg');--pin-logo-height:2.5em;}
.Pin_logo.kaleoz{--pin-logo:url('../images/pin_logo/kaleoz.svg');--pin-logo-height:2em;}
.Pin_logo.seagmpin{--pin-logo:url('../images/pin_logo/seagmpin.svg');--pin-logo-height:1.666667em;}

#Redeem_container #message_box{--spacing:clamp(1em,5vw,3em);background:unset;}
#Redeem_container #message_box h1{font-size:clamp(1.5em,5vw,1.75em);}

#Pin_input_container{display:flex;flex-direction:column;gap:2em;}
.Pin_input_unit{}
.Pin_input_unit .Pin_input{font-size:1.666667em;}
.Pin_input_unit .Pin_input>input{font-family:var(--SiteFF5);font-weight:600;text-align:center;text-transform:uppercase;letter-spacing:.25em;}
.Pin_input_unit .Pin_input>input::-webkit-input-placeholder{font-weight:400;color:var(--body-text-color-a25,rgba(0 0 0/25%));}
.Pin_input_unit .Pin_input .clear{padding-inline:0 1em;opacity:.25;cursor:pointer;}
.Pin_input_unit .Pin_input .clear:hover{opacity:1;}
.Pin_input_unit .Pin_input .clear::before{font-size:1em;margin:0;}

.Pin_display_unit{background:var(--body-text-color-a5,rgba(0 0 0/3%));border-radius:.666667em;display:flex;flex-direction:column;}
.Pin_display_unit .card{background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a0,rgba(0 0 0/10%)) 0 0 0 1px inset;padding:1.5em;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:1em;border-radius:inherit;}
.Pin_display_unit .card .pin{font-family:var(--SiteFF5);font-size:1.666667em;font-weight:600;text-transform:uppercase;letter-spacing:.15em;}
.Pin_display_unit .card .sn{opacity:.5;}
.Pin_display_unit .card .remove{grid-area:1/2/2/3;display:block;cursor:pointer;transition:opacity 300ms;}
.Pin_display_unit .card .remove:not(:hover){opacity:.25;}
.Pin_display_unit .card .remove>span{display:block;--icon-size:2em;width:var(--icon-size);height:var(--icon-size);overflow:hidden;}
.Pin_display_unit .card .remove>span::before{content:attr(icon);display:block;font-size:var(--icon-size);width:1em;height:1em;line-height:1;overflow:hidden;}
.Pin_display_unit .details{display:flex;align-items:center;justify-content:space-between;gap:1em;padding:1em 1.5em;}
.Pin_display_unit .details b{white-space:nowrap;font-weight:800;margin-inline-start:.5em;}
.Pin_display_unit .details .balance{}
.Pin_display_unit .details .deduction b{color:var(--SiteTHM);}
.Pin_display_unit>.tips_wrp>div{margin:1em 1.5em;}

#Redeem_container .tips_wrp{}
#Redeem_container .tips_wrp>div:not(.show){display:none;}
#Redeem_container .tips_wrp>div{margin-block-start:.5em;}
#Redeem_container .tips_wrp>div:first-child{margin-block-start:1em;}
#Redeem_container .tips_wrp .alert{color:var(--text-color-alert);font-weight:800;display:grid;grid-template-columns:auto 1fr;gap:1em;align-items:center;}
#Redeem_container .tips_wrp .alert::before{content:attr(icon);display:block;font-size:1.5em;width:1em;height:1em;line-height:1;overflow:hidden;align-self:start;}

#Pin_input_container .btc{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2em;}
#Pin_input_container .btc .hide{display:none !important;}
#Pin_input_container .btc .load{grid-column:1/-1;text-align:start;--dot-size:1.5em;}
#Pin_input_container .btc .remain{grid-column:1/-1;color:var(--body-text-color-a50,rgba(0 0 0/50%));display:grid;grid-template-columns:auto 1fr;gap:1em;align-items:center;}
#Pin_input_container .btc .remain::before{content:attr(icon);display:block;font-size:1.5em;width:1em;height:1em;line-height:1;overflow:hidden;align-self:start;}
#Pin_input_container .btc .remain b{white-space:nowrap;font-weight:800;color:var(--SiteTHM);}

#Pin_input_container .btc .total{display:flex;flex-direction:column;}
#Pin_input_container .btc .total .T{color:var(--body-text-color-a50,rgba(0 0 0/50%));}
#Pin_input_container .btc .total .C{font-size:1.5em;font-weight:800;line-height:1.333334;color:var(--SiteTHM);order:-1;}

#Pin_input_container .btc .btw{grid-column:-1/-2;}
#Pin_input_container .btc .btw.refetch{background-color:unset;color:currentColor;}
#Pin_input_container .btc .btw.confirm{font-size:1.166667em;text-transform:uppercase;}

@media only screen and (max-width:1000px){
	#sdk_content>.inner{grid-template-columns:1fr;max-width:40em;}

	#Transaction_info,
	#Redeem_container{padding:2em;}
	#Transaction_info>.inner,
	#Redeem_container>.inner{max-width:30em;gap:1.5em;}

	#Pin_input_container{gap:1em;}
	.Pin_input_unit .Pin_input{font-size:1.25em;}
	.Pin_display_unit{border-radius:.5em}
	.Pin_display_unit .card .pin{font-size:1.25em;}
	.Pin_display_unit .card .remove>span{--icon-size:1.5em;}
	.Pin_display_unit .details .deduction span{display:none;}

	#Pin_input_container .btc{gap:1.5em;position:sticky;inset-block-end:0;z-index:9;background:var(--background-color-L1,#fff);box-shadow:var(--body-text-color-a10,rgba(0 0 0/5%)) 0 1px 0 inset;padding-block:1.5em;margin-block-start:.5em;margin-block-end:-2em;}
	@supports (bottom:env(safe-area-inset-bottom)){
		#Pin_input_container .btc{padding-block:max(1.5em,env(safe-area-inset-bottom))}
	}
	#Pin_input_container .btc .total .C{font-size:1.25em;line-height:1.2;}
	#Pin_input_container .btc .btw.confirm{font-size:1em;}
}
@media only screen and (max-width:480px){
	#sdk_content>.inner{padding:1em;gap:1em;}
	#Transaction_info,
	#Redeem_container{padding-inline:1.5em;}
}


/* query */
#query_content{margin-block:auto;}
#query_content>.inner{width:100%;max-width:65em;margin-inline:auto;padding:2em;box-sizing:border-box;display:grid;grid-template-columns:1fr;align-items:start;gap:2em;}

#Query_container{padding:3em;background:var(--background-color-L1,#fff);border-radius:1em;}
#Query_container>.inner{max-width:40em;margin-inline:auto;display:flex;flex-direction:column;gap:2em;}
#Query_container .title{box-shadow:var(--body-text-color-a10,rgba(0 0 0/5%)) 0 1px 0;min-height:5em;padding-block-end:2em;box-sizing:border-box;display:grid;grid-template-columns:1fr auto;gap:1em;align-items:center;}
#Query_container .Pin_logo{background:var(--pin-logo,url('../images/placeholder/blank.svg')) no-repeat var(--inline-start,left) center/contain;color:transparent;height:var(--pin-logo-height);grid-column:1/2;}
#Query_container h2{font-size:clamp(1.5em,5vw,2em);font-weight:800;text-transform:uppercase;}

#SN_input_container{display:flex;flex-direction:column;gap:2em;}

.SN_input_unit{display:flex;flex-direction:column;gap:1em;}
.SN_input_unit .SN_input{font-size:1.666667em;}
.SN_input_unit .SN_input>input{font-family:var(--SiteFF5);font-weight:600;text-align:center;text-transform:uppercase;letter-spacing:.25em;}
.SN_input_unit .SN_input>input::-webkit-input-placeholder{font-family:var(--SiteFF2);font-weight:800;color:var(--body-text-color-a25,rgba(0 0 0/25%));}
.SN_input_unit .SN_input .clear{padding-inline:0 1em;opacity:.25;cursor:pointer;}
.SN_input_unit .SN_input .clear:hover{opacity:1;}
.SN_input_unit .SN_input .clear::before{font-size:1em;margin:0;}

.SN_input_unit .load{text-align:start;}
.SN_input_unit .load .loading{}

.SN_input_unit .tips_wrp{}
.SN_input_unit .tips_wrp>div:not(.show){display:none;}
.SN_input_unit .tips_wrp>div~div{margin-block-start:.5em;}
.SN_input_unit .tips_wrp .alert{color:var(--text-color-alert);font-weight:800;display:grid;grid-template-columns:auto 1fr;gap:1em;align-items:center;}
.SN_input_unit .tips_wrp .alert::before{content:attr(icon);display:block;font-size:2em;width:1em;height:1em;line-height:1;overflow:hidden;align-self:start;}

.SN_input_unit .details{background:var(--body-text-color-a5,rgba(0 0 0/3%));border-radius:.5em;padding:1.5em 2em;display:grid;grid-template-columns:auto 1fr;gap:.75em 2em;}
.SN_input_unit .details .H{grid-column:1/-1;padding-block-end:1.5em;margin-block-end:.75em;box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 1px 0;font-weight:800;}
.SN_input_unit .details .pri{font-weight:800;}
.SN_input_unit .details .current{color:var(--SiteTHM);}
.SN_input_unit .details .time{}

#Query_container .btc .btw{display:block;width: 100%;max-width:20em;margin-inline:auto;}
#Query_container .btc .btw.query{font-size:1.166667em;text-transform:uppercase;}
@media only screen and (max-width:1000px){
	#query_content>.inner{grid-template-columns:1fr;max-width:40em;}
	#Query_container{padding:2em;}
	#Query_container>.inner{max-width:30em;gap:1.5em;}
	.SN_input_unit .SN_input{font-size:1.25em;}
}
@media only screen and (max-width:480px){
	#query_content>.inner{padding:1em;gap:1em;}
	#Query_container{padding:1.5em;}
	.SN_input_unit .details{padding-inline:1.5em;column-gap:1.5em;}
	.SN_input_unit .details .C{text-align:end;}
	#Query_container .btc .btw{max-width:unset;}
}


/* message */
#message_content{margin-block:auto;}
#message_content>.inner{width:100%;max-width:var(--MaxContentWidth);margin-inline:auto;padding:2em;box-sizing:border-box;display:flex;flex-direction:column;align-items:start;gap:2em;}
@media only screen and (max-width:480px){
	#message_content>.inner{padding:1em;}
}

#message_box{width:100%;max-width:50em;margin-inline:auto;--spacing:clamp(3em,5vw,4em);padding:var(--spacing);background:var(--background-color-L2,#fff);border-radius:1em;box-sizing:border-box;}
#message_box>.inner{max-width:40em;margin-inline:auto;display:flex;flex-direction:column;gap:calc(var(--spacing) / 1.5);}
#message_box h1{font-size:clamp(1.75em,5vw,2.5em);font-weight:800;text-transform:uppercase;display:grid;grid-template-columns:auto 1fr;gap:1em;align-items:center;color:var(--ic,CurrentColor);}
#message_box h1::before{content:var(--i,'');display:block;font-size:1.5em;width:1em;height:1em;line-height:1;overflow:hidden;align-self:start;}

#message_box .btc{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1em;}
#message_box .btc .btw{}
#message_box .btc .btw[color="white"]{background-color:unset;color:currentColor;}

#message_box.success{--i:'check_circle_outline';--ic:var(--text-color-complete);}
#message_box.error{--i:'warning';--ic:var(--text-color-alert);}
#message_box.forbidden{--i:'cancel';--ic:var(--text-color-alert);}



/*loading placeholder*/
div.load{display:block;text-align:center;pointer-events:none;--dot-size:2em;}
div.load .loading{display:inline-flex;align-items:center;gap:1em;vertical-align:top;position:relative;white-space:nowrap;color:var(--body-text-color-a50,rgba(0 0 0/50%));}
div.load .loading::before,
div.load .loading::after{content:'';display:block;font-size:var(--dot-size);width:1em;height:1em;border-radius:100%;background:var(--SiteTHM);opacity:0;animation:loadingdot 1500ms 0s ease-out infinite;}
div.load .loading::after{position:absolute;inset-inline-start:0;inset-block:50%;margin-block:-.5em;z-index:1;animation-delay:750ms;}
@keyframes loadingdot{0%{transform:scale(.25);}30%{opacity:1;}100%{transform:scale(1);}}