@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}html,body,div,span,object,iframe,figure,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,em,img,small,strike,strong,sub,sup,tt,b,u,i,ol,ul,li,fieldset,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,canvas,embed,footer,header,nav,section,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;text-size-adjust:none}footer,header,nav,section,main{display:block}body{line-height:1}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input{-webkit-appearance:none;border-radius:0}.svg-white path{fill:#fff}@font-face{font-family:Cloud Soft Bold;src:url(/assets/fonts/cloud_soft-bold-webfont.woff2) format("woff2"),url(/assets/fonts/cloud_soft-bold-webfont.woff) format("woff");font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Cloud Lucent;src:url(/assets/fonts/cloud-lucent-regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.17rem}h4{font-size:1rem}h5{font-size:.83rem}h6{font-size:.67rem}b,strong{font-weight:700}h1,h2,h3,h4,h5,h6,button{font-family:Cloud Soft Bold,sans-serif;font-weight:400}h1 a,h1 li,h2 a,h2 li,h3 a,h3 li,h4 a,h4 li,h5 a,h5 li,h6 a,h6 li,button a,button li{font-family:Cloud Soft Bold,sans-serif}h1,h2,h3,h4,h5,h6,p{margin:16px 0}h1,h2,h3,h4,h5,h6{line-height:1.3}p,li{line-height:1.5}p,a,li,input,label,textarea,.date-time-picker{font-family:IBM Plex Sans Thai,sans-serif;font-weight:400}body{font-family:Cloud Soft Bold,sans-serif;font-size:1rem;color:#f4f4f4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none}button{cursor:pointer;font-family:Cloud Soft Bold;font-size:1rem;color:#323232}a{cursor:pointer;color:#efefef}.remove-deco{text-decoration:none}.annotation{font-size:.8rem;font-style:italic;color:#979797}.annotation *{color:#979797}.annotation.large{font-size:.9rem}.annotation.non-italic{font-style:normal}.annotation.danger{color:#a02e2e}.annotation.dark,.annotation.dark *{color:#f4f4f4}.text-center{text-align:center}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.navbar{box-sizing:border-box;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;min-height:56px;width:100%;border-bottom:0px solid #30231C;z-index:10;background:linear-gradient(180deg,#18110e 4%,#18110e99 60%,#0000)}.navbar h1{text-shadow:-2px -2px 0 #323232,-2px -1px 0 #323232,-2px 0px 0 #323232,-2px 1px 0 #323232,-2px 2px 0 #323232,-1px -2px 0 #323232,-1px -1px 0 #323232,-1px 0px 0 #323232,-1px 1px 0 #323232,-1px 2px 0 #323232,0px -2px 0 #323232,0px -1px 0 #323232,0px 0px 0 #323232,0px 1px 0 #323232,0px 2px 0 #323232,1px -2px 0 #323232,1px -1px 0 #323232,1px 0px 0 #323232,1px 1px 0 #323232,1px 2px 0 #323232,2px -2px 0 #323232,2px -1px 0 #323232,2px 0px 0 #323232,2px 1px 0 #323232,2px 2px 0 #323232;isolation:isolate;z-index:1;margin-bottom:12px;padding:4px 4px 0;line-height:1.7;font-size:1.2em;color:#fff}.navbar div{background-color:transparent;padding:0}.navbar .title-bar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;min-height:64px;width:100%}.navbar .title-bar.flex-start{justify-content:flex-start}.navbar .title-bar.align-top{align-items:flex-start}.navbar .title-bar.center{justify-content:center;text-align:center}.navbar .title-bar.center h1,.navbar .title-bar.center p{padding:0 16px}.navbar .title-bar :first-child.flat-button,.navbar .title-bar :first-child.raised-button,.navbar .title-bar :first-child.icon-button{margin-left:16px;margin-right:8px}.navbar .title-bar div:first-child{display:flex;align-items:center;justify-content:center}.navbar .title-bar div:first-child button{margin-right:0;padding-left:6px;height:38px;width:38px;font-size:24px;font-weight:300;color:#f4e2c0cc;border:2px solid rgba(244,226,192,.6)}.navbar .title-bar div:first-child img{margin-left:0}.navbar .title-bar :last-child.flat-button,.navbar .title-bar :last-child.raised-button,.navbar .title-bar :last-child.icon-button{margin-left:8px;margin-right:16px}.navbar .title-bar h1:first-child{padding-left:16px}.navbar .title-bar h1:last-child{padding-right:16px}.navbar .title-bar .logo{display:block;margin:8px;height:48px;object-fit:contain}.navbar .flat-button,.navbar .raised-button,.navbar .icon-button{z-index:2;margin:8px 16px;flex:none}.navbar.solid{background:linear-gradient(180deg,#404e6b,#2e3d55),linear-gradient(180deg,#bfe9da,#c0cef4),#fff;border-bottom:3px solid #2e2e2e}.navbar.solid h1{color:#fff;text-shadow:0px 1px 0px #2e2e2e}.navbar.solid button{margin:0}.navbar.solid.remove-btm-border{border-bottom:0px solid #30231C}.navbar.solid:after{display:none}.navbar.light{background:none;background-color:#18110e;border-bottom:1px solid #30231C}.navbar.light h1{color:#f4f4f4;text-shadow:none}.navbar.light:after{display:none}.navbar.transparent{background:none;background-color:transparent}.navbar.transparent:after{display:none}.navbar.blur{background:none;background-color:transparent;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.navbar.blur:after{display:none}.navbar.drop-shadow{box-shadow:0 0 5px #00000026}.navbar.remove-btn-margin button{margin:0}.navbar.fixed{position:fixed}.navbar .CircularProgressbar .CircularProgressbar-text{translate:0 .125rem}.app-container{display:block;position:relative;max-width:500px;min-height:100%;margin-right:auto;margin-left:auto;background-color:#18110e}.card{margin:16px;padding:16px;background-color:#e4e4e4;background:linear-gradient(180deg,#fff,#e4e4e4);border-radius:8px;border:2px solid #323232;box-shadow:0 4px #323232}.card-shrink{background-color:#e4e4e4;background:linear-gradient(180deg,#fff,#e4e4e4);border-radius:8px;border:2px solid #323232;box-shadow:0 4px #323232;margin:0;padding:0}form{display:flex;flex-direction:column;color:#f4f4f4}form h3,form h4{font-family:IBM Plex Sans Thai,sans-serif;font-weight:700;font-size:1rem;line-height:1.25}form>:first-child{margin-top:24px}form h3{margin-top:16px}form h4{margin-bottom:8px}form a{display:inline-flex;width:fit-content;align-items:center;margin-bottom:16px;font-size:.9em;text-decoration:underline #f4f4f4 1px;color:#f4f4f4}form a svg{margin:4px}form a svg path{fill:#f4f4f4}form button span{translate:0 0;margin:0;font-family:inherit;font-size:inherit;color:inherit}form span{translate:0 -8px;margin-top:4px;font-family:Bai Jamjuree,sans-serif;font-size:.8em;color:#a02e2e}.divider{background-color:#30231c;height:8px;width:calc(100% + 32px);margin:8px 0 0 -16px}label{line-height:1.5}input,textarea{color-scheme:light;background-color:#f4f4f4}textarea{resize:none;height:100px;padding:8px;margin-bottom:16px;border:2px solid #30231C;border-radius:8px;font-size:16px}textarea:focus-visible{border:2px solid #F4E2C0;outline:none}textarea.invalid{border:2px solid #a02e2e;outline:none}input[type=text],input[type=tel],input[type=email]{height:48px;padding:8px;margin-bottom:16px;border:2px solid #30231C;border-radius:8px;font-size:16px}input[type=text]:focus-visible,input[type=tel]:focus-visible,input[type=email]:focus-visible{border:2px solid #F4E2C0;outline:none}input[type=text].invalid,input[type=tel].invalid,input[type=email].invalid{border:2px solid #a02e2e;outline:none}input[type=radio]{margin:8px;height:20px;width:20px;display:grid;place-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#18110e;font:inherit;color:currentColor;border:1px solid #30231C;border-radius:50%;transition:.12s ease-in-out}@media (hover: hover) and (pointer: fine){input[type=radio]:hover{border:3px solid rgba(244,226,192,.6)}}input[type=radio]:checked{border:0px solid #30231C}input[type=radio]:before{content:"";width:20px;height:20px;opacity:0;border-radius:50%;box-shadow:inset 1em 1em #f4e2c0;transition:.12s ease-in-out}input[type=radio]:checked:before{width:12px;height:12px;opacity:1}input[type=radio]:focus-visible{border:1px solid #30231C}input[type=checkbox]{margin:8px;height:20px;width:20px;display:grid;place-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#18110e;font:inherit;color:currentColor;border:1px solid #30231C;border-radius:4px;transition:.12s ease-in-out}@media (hover: hover) and (pointer: fine){input[type=checkbox]:hover{border:3px solid rgba(244,226,192,.6)}}input[type=checkbox]:checked{border:0px solid #30231C}input[type=checkbox]:before{content:"";width:20px;height:20px;opacity:0;border-radius:2px;box-shadow:inset 1em 1em #f4e2c0;transition:.12s ease-in-out}input[type=checkbox]:checked:before{width:12px;height:12px;opacity:1}input[type=checkbox]:focus-visible{border:1px solid #30231C}input[type=datetime-local]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:48px;width:100%;padding:8px;margin-bottom:16px;border:2px solid #30231C;border-radius:8px;font-size:16px;background-color:#f4f4f4;color:#323232;text-align:left}input[type=datetime-local]::-webkit-date-and-time-value{text-align:left}input[type=datetime-local] span{font-size:16px;color:#323232}input[type=datetime-local]:focus-visible{border:2px solid #F4E2C0;outline:none}input[type=datetime-local].invalid{border:2px solid #a02e2e;outline:none}input[type=file]{display:none}.form-card{background-color:#33261b;border-radius:8px;margin-bottom:16px;padding:8px 4px}.form-card-choice{background-color:#33261b;border-radius:8px;margin-bottom:16px;transition:box-shadow .12s ease-in-out}.form-card-choice:hover{box-shadow:0 0 0 3px #f4e2c099}.form-card-choice.selected{box-shadow:0 0 0 3px #f4e2c0e6}.form-card-user-base{background-color:#33261b;border-radius:8px;margin-bottom:16px;padding:8px 4px;display:grid;grid-template-columns:1fr 1fr 1fr}.form-card-user-base.invalid{border:2px solid #a02e2e}.form-choice{cursor:pointer;min-height:48px;display:flex;align-items:center;font-size:1rem;padding:8px 4px}.form-choice input{flex:none}.form-choice>div{margin:4px}.bill-preview{display:flex;position:relative;min-height:128px;max-height:fit-content;border-radius:8px;border:2px dashed #30231C}.bill-preview h4{font-size:.8rem;box-sizing:content-box;position:absolute;display:flex;align-items:center;justify-content:center;top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);height:24px;width:156px;text-align:center;padding:8px;background-color:#efefefb3;border-radius:8px;backdrop-filter:blur(16px) saturate(150%) brightness(120%);-webkit-backdrop-filter:blur(16px) saturate(150%) brightness(120%);border:1px solid rgba(151,151,151,.3)}.bill-preview img{border-radius:8px;object-fit:cover}@media only screen and (max-width: 450px){.form-choice{font-size:.9rem}.annotation.large.non-italic{font-size:.8rem}}.reading-content>div{margin:16px}.reading-content>div img{margin:0;width:100%;border-radius:8px}.reading-content h2{margin:24px 0 16px}.reading-content h3,.reading-content h4{margin:24px 0 4px}.reading-content ul{margin:0 0 16px;padding:0 0 0 24px}.reading-content li.no-style{list-style:none;margin-left:-24px}.reading-content li.no-style img{padding:16px 0}.reading-content li.no-style img.rem-btm-padding{padding-bottom:0}.reading-content p{margin-top:0}.reading-content hr{margin:24px 0}.reading-content img{box-sizing:border-box;width:calc(100% - 32px);margin:16px 16px 0;border-radius:8px}.reading-content .main-heading{color:#384f76}.reading-content .margin-4{margin-bottom:4px;margin-top:4px}.reading-content .margin-t-0{margin-top:0}.reading-content .margin-t-8{margin-top:8px}.reading-content .margin-t-24{margin-top:24px}.reading-content .margin-b-4{margin-bottom:4px}.reading-content .margin-b-16{margin-bottom:16px}.list-tile{margin:8px 16px 16px;padding:8px 24px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;min-height:88px;border-radius:16px;background:linear-gradient(180deg,#fff 38.73%,#e4e4e4);box-shadow:0 0 5px #00000026;transition:box-shadow .12s ease-in-out}.list-tile.img-button{cursor:pointer;padding:0;display:flex;height:auto}.list-tile.img-button img{height:100%;width:100%;border-radius:16px;object-fit:cover}.list-tile.text-button{cursor:pointer}.list-tile.text-button h2,.list-tile.text-button p{margin:0}.list-tile.text-button svg path{fill:#c6c6c6}.list-tile:first-child{margin-top:19px}.list-tile.disable-hover{cursor:default;pointer-events:none}@media (hover: hover) and (pointer: fine){.list-tile.img-button:hover,.list-tile.text-button:hover{box-shadow:0 0 0 3px #f4e2c099}}.flat-button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-family:Cloud Soft Bold;border:none;background-color:#33261b;transition:box-shadow .12s ease-in-out;box-shadow:0 0 0 1px #f4e2c000;width:fit-content;padding:4px 8px;min-height:32px;border-radius:4px}@media (hover: hover) and (pointer: fine){.flat-button:hover{box-shadow:0 0 0 3px #f4e2c099}}.flat-button.selected{box-shadow:0 0 0 3px #f4e2c0e6}.flat-button.large{min-height:38px;border-radius:6px}.flat-button :first-child:last-child{margin:0}.flat-button :last-child{margin-left:8px}.flat-button svg path{fill:#323232}.raised-button{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:4px 8px 2px;min-height:38px;text-align:center;text-decoration:none;font-family:Cloud Soft Bold;border:2px solid #F4E2C0;border-radius:48px;color:#f4e2c0;background:#18110eab;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:.24s ease-in-out}.raised-button svg{margin:0 4px 4px}.raised-button span{margin:0 4px}@media (hover: hover) and (pointer: fine){.raised-button:hover{box-shadow:0 0 1rem .25rem #f4e2c080}}.raised-button:focus-visible,.raised-button:active{box-shadow:0 0 1rem .25rem #f4e2c080}.raised-button.clear{background:transparent}.raised-button.highlight{border:none;color:#323232;background:linear-gradient(180deg,#f4e2c0,#dec89e)}.raised-button.disabled{filter:grayscale(1) contrast(.45) brightness(.8)}.raised-button.disabled:hover{cursor:not-allowed;box-shadow:none}.raised-button.disabled:focus-visible,.raised-button.disabled:active{box-shadow:none}.raised-button.full-width{width:100%}.raised-button.small{min-height:24px}.raised-button.large{min-height:48px;font-size:1.2rem}.icon-button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:0;height:56px;width:56px;color:#fff;text-align:center;font-size:1.4rem;text-shadow:0px 1px 0px #2e2e2e;background-color:transparent;border:1px solid transparent;border-radius:6px;transition:.12s ease-in-out}.icon-button span{display:inline-flex;align-items:center;justify-content:center;margin:0;height:24px;width:24px}.icon-button div{height:24px;margin-top:25%;margin-bottom:25%}.icon-button div svg path{fill:#fff}.icon-button.fab{border:none;border-radius:8px;box-shadow:0 0 5px #00000026;background-color:#5b4430}.icon-button.light{color:#323232;text-shadow:none}.icon-button.light svg path{fill:#323232}@media (hover: hover) and (pointer: fine){.icon-button:hover{border-radius:8px;background-color:#0000001f}.icon-button:hover.fab{border:none;border-radius:8px;box-shadow:0 0 0 3px #f4e2c0;background-color:#5b4430}.icon-button:hover.light{border-radius:8px;background-color:#0000003d}}.share-button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:0;height:56px;width:56px;color:#fff;text-align:center;font-size:1.4rem;background-color:#979797;border-radius:50%;position:relative;top:0;left:0}.share-button span{display:inline-flex;align-items:center;justify-content:center;margin:0;height:24px;width:24px}.share-button div{height:24px;margin-top:25%;margin-bottom:25%}.share-button div svg path{fill:#fff}@keyframes dialog-in{0%{translate:0 8px;opacity:0}to{translate:0 0;opacity:1}}@keyframes dialog-out{0%{translate:0 0;opacity:1}to{translate:0 8px;opacity:0}}@keyframes backdrop-in{0%{background-color:#18110e00;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{background-color:#18110e6b;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}}@keyframes backdrop-out{0%{background-color:#18110e6b;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}to{background-color:#18110e00;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}}dialog{display:block;pointer-events:none;overflow:visible;opacity:0;-webkit-user-select:none;user-select:none;box-sizing:border-box;max-width:468px;padding:0;border-radius:16px;box-shadow:0 0 1rem .25rem #37271980;border:.125rem solid #372719;color:#f4f4f4;background-color:#18110e;transform:perspective(400px) translateZ(0);will-change:transform contents}dialog div:focus{outline:none}dialog button:focus{outline:none}dialog::backdrop{background-color:#18110e00}dialog.show-close-hint:after{text-shadow:-2px -2px 0 #323232,-2px -1px 0 #323232,-2px 0px 0 #323232,-2px 1px 0 #323232,-2px 2px 0 #323232,-1px -2px 0 #323232,-1px -1px 0 #323232,-1px 0px 0 #323232,-1px 1px 0 #323232,-1px 2px 0 #323232,0px -2px 0 #323232,0px -1px 0 #323232,0px 0px 0 #323232,0px 1px 0 #323232,0px 2px 0 #323232,1px -2px 0 #323232,1px -1px 0 #323232,1px 0px 0 #323232,1px 1px 0 #323232,1px 2px 0 #323232,2px -2px 0 #323232,2px -1px 0 #323232,2px 0px 0 #323232,2px 1px 0 #323232,2px 2px 0 #323232;position:absolute;overflow:visible;bottom:-56px;width:100%;height:32px;background-color:#323232;background:radial-gradient(circle,#323232,#323232df 18%,#323232ba 40%,#32323200 92%);text-align:center;line-height:2;font-size:1.2rem;color:#f4f4f4;opacity:0;content:"แตะเพื่อปิดหน้าต่างนี้"}dialog[open]{pointer-events:visible;opacity:1;animation:dialog-in .18s ease forwards}dialog[open]::backdrop{background-color:#18110e6b;animation:backdrop-in .12s ease forwards}dialog[open].show-close-hint:after{animation:dialog-in .36s ease .24s forwards}dialog.hide{animation:dialog-out .12s ease forwards}dialog.hide::backdrop{animation:backdrop-out .12s ease forwards}dialog.hide.show-close-hint:after{animation:dialog-out .12s ease forwards}dialog .reading-content img{width:100%;margin:0;border-radius:0}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:98;background-color:#00000065}.modal-body{position:absolute;overflow:auto;z-index:99;box-sizing:border-box;top:50%;left:50%;right:auto;bottom:auto;margin-right:-50%;padding:0;border-radius:16px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #323232;box-shadow:0 3px #323232}.modal-body .reading-content img{width:100%;margin:0;border-radius:0}.modal-top-button-bar{display:flex;justify-content:end;position:sticky;top:0;height:0;z-index:10}.modal-top-button-bar button{width:48px;height:48px;border-radius:0 0 0 16px;background-color:#ffffff14}.modal-top-button-bar button:hover,.modal-top-button-bar button:hover.light{border-radius:0 0 0 16px}.modal-top-button-bar button.light{background-color:#0000001f}.modal-top-button-bar button span{margin-top:2px}.modal-card{margin:16px;padding:16px;background-color:#f4f4f4;color:#323232;border-radius:8px;text-align:left}.modal-card p{margin:0 0 4px}.modal-button-bar{position:sticky;z-index:9;bottom:0;padding:16px;background-color:#18110e;background:linear-gradient(180deg,#fff0,#18110e 50%)}.modal-button-bar.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ReactModal__Overlay{opacity:0;transition:opacity .12s ease-in-out}.ReactModal__Overlay--after-open{opacity:1}.ReactModal__Overlay--before-close{opacity:0}.ReactModal__Body{opacity:0;transition:opacity .12s ease-in-out}.ReactModal__Body--after-open{opacity:1}.ReactModal__Body--before-close{opacity:0}.pagination{height:14px;width:14px;border:2px solid #30231C;border-radius:50%;background-color:#30231c;transition:.12s ease-in-out}.pagination.active{background-color:#f4e2c0}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{height:2px!important}.swiper-horizontal>.swiper-scrollbar .swiper-scrollbar-drag,.swiper-scrollbar.swiper-scrollbar-horizontal .swiper-scrollbar-drag{background:#fff6}.swiper-scrollbar{background:transparent!important}.simplebar-scrollbar:before{background-color:#fff6!important}.simplebar-track.simplebar-vertical{width:6px!important}.simplebar-hidden .simplebar-scrollbar:before{background-color:transparent}.custom-scrollbar{overflow:auto}.custom-scrollbar::-webkit-scrollbar{width:8px;height:8px}.custom-scrollbar::-webkit-scrollbar-track{border-radius:8px;background:#fff0}.custom-scrollbar::-webkit-scrollbar-track:hover{background:#fff3}.custom-scrollbar::-webkit-scrollbar-thumb{border-radius:8px;border:3px solid hsla(0,0%,100%,0);background:#fff3;background-clip:content-box;transition:.12s border ease-in-out}.custom-scrollbar::-webkit-scrollbar-thumb:hover{border:0px solid hsla(0,0%,100%,0);background:#fff6;background-clip:content-box}.title-bar{position:sticky;top:0;padding:16px;z-index:2;background-color:#fff}.social-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:16px}.social-card h2{margin-top:0}.social-card .button-bar{display:flex;flex-flow:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px;width:fit-content;padding-bottom:16px}.social-card .button-bar img{width:48px;height:48px}.social-card button{margin-top:4px;max-width:75%}.top-section{position:relative;z-index:1;isolation:isolate;height:auto;-webkit-user-select:none;user-select:none}.top-section:after{content:"";z-index:0;pointer-events:none;position:absolute;bottom:0;width:100%;height:calc(100% + 64px);background:url(/assets/preview_bg.webp);background-repeat:repeat;background-position:bottom center}.bottom-section{overflow:hidden;background-color:#18110e;color:#f4e2c0}.bottom-section h1{margin:.5rem 0 0}.bottom-section h1,.bottom-section .navbar,.bottom-section .navbar.light{color:#f4e2c0;border:none}.bottom-section h1 h1,.bottom-section .navbar h1,.bottom-section .navbar.light h1{color:#f4e2c0}.prv-container{z-index:3;isolation:isolate;position:relative;-webkit-user-select:none;user-select:none;height:208px;max-width:100%;margin:auto;padding:0 0 8px;display:flex;align-items:center;justify-content:center}.prv-container-shadow{z-index:2;position:absolute;width:100%}.prv-button-bar{box-sizing:border-box;z-index:5;position:absolute;width:100%;padding:11px 16px;display:flex;gap:8px;justify-content:space-between;align-items:flex-end}.prv-button-bar div{display:flex;gap:8px;align-items:flex-end}.prv-button-bar .preset-tools{flex-direction:column;height:100%;justify-content:center;transition:.12s ease-in-out}.prv-button-bar .preset-tools.hidden{opacity:0;pointer-events:none}.prv-button-bar .preset-tools .flat-button{border-radius:6px;height:36px;width:36px;background-color:#f4e2c0;box-shadow:0 0 0 2px #97979766}.prv-button-bar .preset-tools .flat-button.with-text{height:32px;width:unset}.prv-button-bar .preset-tools .flat-button.with-text span{margin-left:4px}@media (hover: hover) and (pointer: fine){.prv-button-bar .preset-tools .flat-button:hover{box-shadow:0 0 0 3px #e5ba6999}}.loading-img{box-sizing:content-box;position:relative;display:flex;justify-content:center;align-items:center;margin:20% auto;height:72px;opacity:1;image-rendering:auto;transition:.3s ease-in-out;background-color:#f4e2c03d;padding:16px;border-radius:16px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 0 1rem .25rem #37271980}.loading-img.hidden{opacity:0}.loading-text{text-shadow:-2px -2px 0 #323232,-2px -1px 0 #323232,-2px 0px 0 #323232,-2px 1px 0 #323232,-2px 2px 0 #323232,-1px -2px 0 #323232,-1px -1px 0 #323232,-1px 0px 0 #323232,-1px 1px 0 #323232,-1px 2px 0 #323232,0px -2px 0 #323232,0px -1px 0 #323232,0px 0px 0 #323232,0px 1px 0 #323232,0px 2px 0 #323232,1px -2px 0 #323232,1px -1px 0 #323232,1px 0px 0 #323232,1px 1px 0 #323232,1px 2px 0 #323232,2px -2px 0 #323232,2px -1px 0 #323232,2px 0px 0 #323232,2px 1px 0 #323232,2px 2px 0 #323232;font-family:Cloud Soft Bold,sans-serif;position:absolute;top:50%;left:50%;transform:translate(-50%,90%);font-size:14px;color:#f4f4f4;opacity:1;text-align:center;transition:.3s ease-in-out}.loading-text.hidden{opacity:0}.tab-bar{-webkit-user-select:none;user-select:none;background-color:#18110e;border-bottom:1px solid #30231C}.tab-button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:0;text-align:center;text-decoration:none;font-family:Cloud Soft Bold;border:none;background-color:#33261b;transition:box-shadow .12s ease-in-out;box-shadow:0 0 0 1px #f4e2c000;height:45px;width:45px;border-radius:6px}@media (hover: hover) and (pointer: fine){.tab-button:hover{box-shadow:0 0 0 3px #f4e2c099}}.tab-button.selected{box-shadow:0 0 0 3px #f4e2c0e6}.tab-button img{width:45px;height:45px;border-radius:6px}.color-tab-button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:0;text-align:center;text-decoration:none;font-family:Cloud Soft Bold;border:none;background-color:#33261b;transition:box-shadow .12s ease-in-out;box-shadow:0 0 0 1px #f4e2c000;position:relative;height:24px;border-radius:4px}@media (hover: hover) and (pointer: fine){.color-tab-button:hover{box-shadow:0 0 0 3px #f4e2c099}}.color-tab-button.selected{box-shadow:0 0 0 3px #f4e2c0e6}.color-tab-button .icon{position:absolute;top:50%;left:50%;width:100%;height:100%;translate:-50% -25%;background:radial-gradient(circle,#0000001a 42%,#0000);border-radius:4px;opacity:0;transition:.2s ease-in-out}.color-tab-button .icon path{fill:#fff;stroke:#323232;stroke-width:1px}.color-tab-button.selected .icon{opacity:1;translate:-50% -50%}.color-tab-button img{width:24px;height:24px;border-radius:4px}.group-tab-button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-decoration:none;font-family:Cloud Soft Bold;border:none;background-color:#33261b;transition:box-shadow .12s ease-in-out;box-shadow:0 0 0 1px #f4e2c000;position:relative;height:32px;padding:2px 8px;border-radius:6px;text-align:center}@media (hover: hover) and (pointer: fine){.group-tab-button:hover{box-shadow:0 0 0 3px #f4e2c099}}.group-tab-button.selected{box-shadow:0 0 0 3px #f4e2c0e6}.group-tab-button h4{color:#f4e2c0;font-size:16px;margin:auto}.grid-scroll-area{box-sizing:border-box;overflow-x:hidden;overflow-y:auto;padding:16px 16px 0}.grid-scroll-area::-webkit-scrollbar{width:8px}.grid-scroll-area::-webkit-scrollbar-track{border-radius:8px;background:#fff0}.grid-scroll-area::-webkit-scrollbar-track:hover{background:#fff3}.grid-scroll-area::-webkit-scrollbar-thumb{border-radius:8px;border:3px solid hsla(0,0%,100%,0);background:#fff3;background-clip:content-box;transition:.12s border ease-in-out}.grid-scroll-area::-webkit-scrollbar-thumb:hover{border:0px solid hsla(0,0%,100%,0);background:#fff6;background-clip:content-box}.grid-container-wrapper{scroll-margin-top:10px}.grid-container{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}.grid-container button,.grid-container a{box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:0;text-align:center;text-decoration:none;font-family:Cloud Soft Bold;border:none;background-color:#33261b;transition:box-shadow .12s ease-in-out;box-shadow:0 0 0 1px #f4e2c000;border-radius:8px;background:linear-gradient(134deg,#987253,#694a30)}@media (hover: hover) and (pointer: fine){.grid-container button:hover,.grid-container a:hover{box-shadow:0 0 0 3px #f4e2c099}}.grid-container button.selected,.grid-container a.selected{box-shadow:0 0 0 3px #f4e2c0e6}.grid-container button span,.grid-container a span{display:flex}.grid-container button span img,.grid-container a span img,.grid-container button img,.grid-container a img{height:100%;width:100%;border-radius:8px}@keyframes guild-card-open{0%{opacity:0;transform:translateY(48px);filter:brightness(0)}12%{filter:brightness(2)}to{opacity:1;transform:translate(0);filter:brightness(1)}}.success{position:relative;display:flex;flex-direction:column;align-items:center;overflow-x:hidden;min-height:100svh;color:#f4e2c0;background:linear-gradient(180deg,#18110e 60%,#080605);color-scheme:dark}.success h3{margin-bottom:0}.success .bg{display:block;position:absolute;width:100%;height:auto;object-fit:cover;opacity:.12;-webkit-mask-image:linear-gradient(180deg,black 90%,transparent 100%);mask-image:linear-gradient(180deg,black 90%,transparent 100%)}.success .container{position:relative;z-index:1;width:calc(100% - 32px);padding:16px;text-align:center}.success #page-title{padding-bottom:0}.success #page-title h3{margin-bottom:8px}.success #page-title p{margin-top:8px}.success .guild-card-container{position:relative;width:100%;height:100%;border-radius:8px}.success .guild-card{display:block;border-radius:8px;transform-origin:top center;animation:guild-card-open 1.5s cubic-bezier(.165,.84,.44,1) forwards;will-change:transform}.success .guild-card-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;color:#f4e2c0}.success .button-bar{width:calc(100% - 32px);display:grid;grid-template-columns:1fr 1fr;grid-gap:16px}.success .button-bar .raised-button{display:inline-flex;flex-wrap:wrap}.success .button-bar .raised-button span{margin:0}.success .greeting{background-color:#18110e;border:rgba(244,226,192,.42) 1px solid;border-radius:.5rem;padding:16px}.success .greeting p{margin:0}.success .greeting h3{font-family:IBM Plex Sans Thai,sans-serif;font-weight:700}.success .greeting :last-child{font-size:.85rem}.success .audition{background:linear-gradient(66deg,#98725366,#694a3066);border:rgba(244,226,192,.42) 1px solid;border-radius:.5rem;display:flex;justify-content:space-between;aspect-ratio:2.75/1}.success .audition .char-img{position:relative;width:50%}.success .audition .char-img img{position:absolute;bottom:0;left:0;width:auto;height:100%;object-fit:cover;border-radius:.5rem;transform-origin:100% 100%;transform:scale(1.1) translate(3%)}.success .audition .text-img{z-index:2;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:40%;padding:16px 0}.success .audition .text-img img{width:90%;height:auto;object-fit:contain;transform:translateY(-8px)}.success .audition .text-img button{width:70%;min-height:24px;height:25%;max-height:38px;font-size:clamp(9px,4vw,16px)}.success .social-button-bar{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:24px;padding:16px 0;flex-wrap:wrap;color:#f4e2c0;transition:opacity .2s ease-in-out}.success .social-button-bar a{color:inherit;width:3.25rem;height:3.25rem;display:flex;align-items:center;justify-content:center;border-radius:1rem;background-color:#6d604899;border:2px solid rgba(244,226,192,.6);font-size:.85rem;font-weight:600;text-decoration:none;transform:rotate(45deg) scale(1);-webkit-backdrop-filter:blur(.5rem);backdrop-filter:blur(.5rem);transition:transform .2s ease-in-out,box-shadow .2s ease-in-out,background-color .2s ease-in-out}.success .social-button-bar a svg{transform:rotate(-45deg) scale(1)}.success .social-button-bar a:hover{background-color:#b4904e99;box-shadow:0 0 1rem .25rem #f4e2c080;transform:rotate(45deg) scale(1.1)}.success .footer p{display:inline-flex;flex-wrap:wrap;justify-content:center;color:#f4f4f4}.success .footer .copyright{margin-top:24px;display:flex;flex-direction:column;align-items:center}.success .footer .copyright a{margin-bottom:8px}.success .footer .copyright p{margin-top:8px;font-size:.85rem;font-weight:400}body{overscroll-behavior:contain;color-scheme:dark;-webkit-tap-highlight-color:transparent}*,:after,:before{box-sizing:inherit;background-repeat:no-repeat}body{background-color:#0e0a08;color:#f4f4f4;margin:0;overflow-y:auto;scrollbar-gutter:auto}button{-webkit-appearance:none;-moz-appearance:none;appearance:none}