.form{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh}.form input{width:100%;max-width:400px;padding:1rem;margin-bottom:1rem;border:1px solid #ccc;border-radius:4px;font-size:1rem}.loader{color:#fff;font-size:10px;width:1em;height:1em;border-radius:50%;position:relative;text-indent:-9999em;animation:mulShdSpin 1.3s linear infinite;transform:translateZ(0)}@keyframes mulShdSpin{0%,to{box-shadow:0 -3em 0 .2em,2em -2em 0 0,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 0}12.5%{box-shadow:0 -3em 0 0,2em -2em 0 .2em,3em 0 0 0,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}25%{box-shadow:0 -3em 0 -.5em,2em -2em 0 0,3em 0 0 .2em,2em 2em 0 0,0 3em 0 -1em,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}37.5%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 0,2em 2em 0 .2em,0 3em 0 0,-2em 2em 0 -1em,-3em 0 0 -1em,-2em -2em 0 -1em}50%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 0,0 3em 0 .2em,-2em 2em 0 0,-3em 0 0 -1em,-2em -2em 0 -1em}62.5%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 0,-2em 2em 0 .2em,-3em 0 0 0,-2em -2em 0 -1em}75%{box-shadow:0 -3em 0 -1em,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 0,-3em 0 0 .2em,-2em -2em 0 0}87.5%{box-shadow:0 -3em 0 0,2em -2em 0 -1em,3em 0 0 -1em,2em 2em 0 -1em,0 3em 0 -1em,-2em 2em 0 0,-3em 0 0 0,-2em -2em 0 .2em}}body{margin:0;background-color:#000;font-family:Noto Sans Thai,sans-serif}#__next{height:100vh;width:100vw}.video-with-overlay-container{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;margin:0 auto;outline:none}.video-with-overlay-container .loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.video-with-overlay-container .shortcut-feedback-overlay{position:absolute;inset:0;display:flex;pointer-events:none;z-index:5;color:#fff}.video-with-overlay-container .shortcut-feedback-overlay--center,.video-with-overlay-container .shortcut-feedback-overlay--volume{align-items:center;justify-content:center}.video-with-overlay-container .shortcut-feedback-overlay--seek-backward,.video-with-overlay-container .shortcut-feedback-overlay--seek-forward{align-items:center}.video-with-overlay-container .shortcut-feedback-overlay--seek-backward{justify-content:flex-start;padding-left:8%}.video-with-overlay-container .shortcut-feedback-overlay--seek-forward{justify-content:flex-end;padding-right:8%}.video-with-overlay-container .shortcut-feedback-bezel{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;background-color:rgba(0,0,0,.3);animation:shortcut-feedback-bezel .7s ease-out forwards}.video-with-overlay-container .shortcut-feedback-bezel img[alt=Play]{margin-left:4px}.video-with-overlay-container .shortcut-feedback-seek{position:relative;z-index:1;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;height:50px;width:85px;min-width:0;aspect-ratio:1.7;padding:0 10px;border-radius:7px;background-color:rgba(0,0,0,.3);animation:shortcut-feedback-seek-pop .7s ease-out forwards}.video-with-overlay-container .shortcut-feedback-seek-chevron{display:block;flex-shrink:0}.video-with-overlay-container .shortcut-feedback-seek-chevron--fixed,.video-with-overlay-container .shortcut-feedback-seek-chevron--moving,.video-with-overlay-container .shortcut-feedback-seek-chevrons{display:inline-flex;align-items:center}.video-with-overlay-container .shortcut-feedback-seek-chevrons{position:relative;width:10px;height:16px}.video-with-overlay-container .shortcut-feedback-seek-chevron--fixed,.video-with-overlay-container .shortcut-feedback-seek-chevron--moving{position:absolute;top:0}.video-with-overlay-container .shortcut-feedback-seek--forward .shortcut-feedback-seek-chevron--fixed,.video-with-overlay-container .shortcut-feedback-seek--forward .shortcut-feedback-seek-chevron--moving{right:0}.video-with-overlay-container .shortcut-feedback-seek--forward .shortcut-feedback-seek-chevron--moving{animation:shortcut-feedback-chevron-forward .35s ease-out forwards}.video-with-overlay-container .shortcut-feedback-seek--backward .shortcut-feedback-seek-chevron--fixed,.video-with-overlay-container .shortcut-feedback-seek--backward .shortcut-feedback-seek-chevron--moving{left:0}.video-with-overlay-container .shortcut-feedback-seek--backward .shortcut-feedback-seek-chevron--moving{animation:shortcut-feedback-chevron-backward .35s ease-out forwards}.video-with-overlay-container .shortcut-feedback-seek-seconds{display:inline-flex;align-items:center;height:16px;margin-top:3px;font-size:18px;font-weight:500;letter-spacing:.02em;line-height:16px;white-space:nowrap;animation:shortcut-feedback-seek-value-pop .22s ease-out}.video-with-overlay-container .shortcut-feedback-volume{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.video-with-overlay-container .shortcut-feedback-volume-bezel{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;background-color:rgba(0,0,0,.3);animation:shortcut-feedback-bezel .7s ease-out forwards}.video-with-overlay-container .shortcut-feedback-volume-icon{display:block;flex-shrink:0}.video-with-overlay-container .shortcut-feedback-top-position{position:absolute;top:12%;left:50%;transform:translateX(-50%)}.video-with-overlay-container .shortcut-feedback-top-label{display:block;padding:12px 16px;border-radius:4px;background-color:rgba(0,0,0,.3);font-size:20px;font-weight:600;line-height:1;min-width:3ch;text-align:center;animation:shortcut-feedback-bezel .7s ease-out forwards}.video-with-overlay-container .shortcut-feedback-top-label--persistent{animation:none}@keyframes shortcut-feedback-chevron-forward{0%{opacity:0;transform:translateX(-10px)}25%{opacity:1;transform:translateX(-8px)}75%{opacity:1;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes shortcut-feedback-chevron-backward{0%{opacity:0;transform:translateX(10px)}25%{opacity:1;transform:translateX(8px)}75%{opacity:1;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}@keyframes shortcut-feedback-seek-value-pop{0%{transform:scale(.88)}55%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes shortcut-feedback-seek-pop{0%{opacity:0;transform:scale(.92)}15%{opacity:1;transform:scale(1.04)}30%{transform:scale(1)}75%{opacity:1}to{opacity:1}}@keyframes shortcut-feedback-bezel{0%{opacity:0;transform:scale(.85)}12%{opacity:1;transform:scale(1)}70%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.05)}}.video-with-overlay-container video{width:100%;pointer-events:none}.video-with-overlay-container .video-gesture-catcher,.video-with-overlay-container video{-webkit-user-drag:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.video-with-overlay-container .video-gesture-catcher{position:absolute;inset:0;touch-action:none}.video-with-overlay-container .video-wrapper{width:100%;max-width:177.7777777778vh;position:relative;touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none}.video-with-overlay-container .video-wrapper .overlay-container{display:flex;align-items:center;justify-content:center;position:absolute;left:0;top:0;width:100%;height:10%;color:#fff;font-size:2rem}.video-with-overlay-container .video-wrapper .overlay-container .header-bg{position:absolute;left:0;top:0;width:100%}.video-with-overlay-container .video-wrapper .overlay-container .title{position:absolute;font-size:min(2vw,4vh);font-weight:700;transform:translateX(-5%);width:50%}.video-with-overlay-container .video-wrapper .overlay-container .title p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-with-overlay-container .video-wrapper .overlay-container .problem-and-page-no-section{display:flex;position:absolute;right:12px;font-size:min(1.5vw,3vh)}.video-with-overlay-container .video-wrapper .overlay-container .problem-and-page-no-section .page-no,.video-with-overlay-container .video-wrapper .overlay-container .problem-and-page-no-section .problem-no{color:#3b3b3b;font-weight:700}.video-with-overlay-container .video-wrapper .overlay-container .problem-and-page-no-section .page-no:after{content:"";border:1px solid #d8d8d8;height:40px;margin:0 min(1.5vw,3vh)}.video-with-overlay-container .video-wrapper .transition-overlay-container{display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);color:#fff;font-size:2rem}.video-with-overlay-container .video-wrapper .transition-overlay-container .title{font-size:80%;position:absolute;left:50%;top:10%;transform:translateX(-50%)}.video-with-overlay-container .video-wrapper .popup-overlay-container{display:flex;justify-content:center;align-items:center;position:absolute;left:10%;bottom:20%;width:30%;height:20%;padding:1rem;background-color:rgba(0,0,0,.8);color:#fff;font-size:2rem;flex-direction:column}.video-with-overlay-container .video-wrapper .popup-overlay-container .title{font-size:min(1.5vw,2.5vh)}.video-with-overlay-container .video-wrapper .popup-overlay-container .text{font-size:min(1vw,1.5vh)}.video-with-overlay-container .video-controller{position:fixed;bottom:0;left:0;width:100%;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(0deg,#000,transparent);transition:0s ease-in-out,.5s ease-in-out;padding:24px 0 8px}.video-with-overlay-container .video-controller.hide{transform:translateY(calc(100% + 0px))}.video-with-overlay-container .video-controller .chapter-container{display:flex;overflow:auto;padding:0 16px 12px}.video-with-overlay-container .video-controller .chapter-container .chapter-list{display:flex;align-items:baseline;gap:20px;margin:auto;position:relative}.video-with-overlay-container .video-controller .chapter-container .chapter-list:after{content:"";position:absolute;height:3px;background:#3b3b3b;width:100%;top:calc(50% - 1px);z-index:-1}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip{display:flex;padding:8px 16px;font-size:.875rem;color:#d8d8d8;background:#3b3b3b;cursor:pointer;white-space:nowrap;border-radius:50px;transition:background .25s ease}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip:hover{background:#4f4f4f}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip.active{font-weight:700;background:#0074ff;color:#fff}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip.active.prioritized{background:#f76262}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip.disable{color:#666;pointer-events:none}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip .prioritized-chapter-info{display:inline-flex;margin-right:.5rem;align-items:center}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip .prioritized-chapter-info .chapter-time{transition:.2s ease;margin-left:4px;max-width:40px;opacity:1}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip .prioritized-chapter-info .chapter-time.hide{margin-left:0;width:0;opacity:0;overflow:hidden}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip .default-chapter-info{display:inline-flex;align-items:center;transition:.2s ease;margin-right:.5rem;max-width:40px}.video-with-overlay-container .video-controller .chapter-container .chapter-list .chapter-chip .default-chapter-info.hide{margin-right:0;width:0;overflow:hidden;opacity:0}.video-with-overlay-container .video-controller .progress-container{width:100%;display:flex}.video-with-overlay-container .video-controller .progress-container .progress-bar-container{width:100%;display:flex;align-items:center;cursor:pointer}.video-with-overlay-container .video-controller .progress-container .progress-bar{position:relative;border-radius:4px;background-color:#fff;flex:1 1;height:8px;display:flex}.video-with-overlay-container .video-controller .progress-container .progress-bar .left{position:relative;border-radius:4px;background-color:#0074ff;pointer-events:none}.video-with-overlay-container .video-controller .progress-container .progress-bar .left .cursor{position:absolute;right:0;width:10px;height:10px;transform:translate3d(-50%,-50%);background-color:#fff}.video-with-overlay-container .video-controller .progress-container .progress-bar .right{border-radius:4px;pointer-events:none}.video-with-overlay-container .video-controller .progress-container .progress-bar .hover-preview{position:absolute;width:8px;height:100%;background-color:#ccc;pointer-events:none;transform:translateX(-50%)}.video-with-overlay-container .video-controller .progress-container .progress-bar .hover-preview .preview-timestamp{position:absolute;background-color:#000;color:#fff;transform:translate(-50%,-200%);padding:4px 8px;border-radius:2px}.video-with-overlay-container .video-controller .progress-container .timestamp{color:#fff;width:96px;text-align:center}.video-with-overlay-container .video-controller .control-container{display:flex;justify-content:center}.video-with-overlay-container .video-controller .control-container .play-pause-seek{padding:12px 0;display:flex;gap:48px;position:absolute}@media screen and (max-width:480px){.video-with-overlay-container .video-controller .control-container .play-pause-seek{gap:24px}}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume{padding:12px 32px;display:flex;gap:16px;flex:0 1 auto;margin-left:auto}@media screen and (max-width:480px){.video-with-overlay-container .video-controller .control-container .resolution-speed-volume{padding:12px 24px}}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector{position:relative;display:flex;justify-content:center}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-text{height:32px;line-height:32px;width:48px;text-align:center;color:#fff;cursor:pointer}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-text:hover~.speed-selector-menu{display:block}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-menu{display:none;position:absolute;padding:0;margin:0;border-top-color:rgba(43,51,63,.7);background-color:rgba(74,73,74,.8);border-radius:10px;bottom:32px;z-index:1;list-style:none}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-menu li{cursor:pointer;color:#fff;padding:12px 16px;text-decoration:none;display:block;text-align:center}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-menu li:hover{background-color:rgba(115,133,159,.5)}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-menu li:first-child{border-top-left-radius:10px;border-top-right-radius:10px}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-menu li:last-child{border-bottom-left-radius:10px;border-bottom-right-radius:10px}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .speed-selector .speed-selector-menu:hover{display:block}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector{position:relative;display:flex;justify-content:center}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-text{height:32px;line-height:32px;min-width:56px;padding:0 8px;text-align:center;color:#fff;cursor:pointer;white-space:nowrap}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-text:hover~.quality-selector-menu{display:block}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu{display:none;position:absolute;padding:0;margin:0;border-top-color:rgba(43,51,63,.7);background-color:rgba(74,73,74,.8);border-radius:10px;bottom:32px;z-index:1;list-style:none}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu li{cursor:pointer;color:#fff;padding:12px 16px;text-decoration:none;display:flex;align-items:center;gap:6px;white-space:nowrap}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu li:hover{background-color:rgba(115,133,159,.5)}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu li:first-child{border-top-left-radius:10px;border-top-right-radius:10px}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu li:last-child{border-bottom-left-radius:10px;border-bottom-right-radius:10px}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu li .check{display:inline-block;width:12px;text-align:center}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .quality-selector .quality-selector-menu:hover{display:block}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .volume-selector{display:flex;position:relative;padding:4px 8px;cursor:pointer}@media screen and (max-width:1200px){.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .volume-selector{display:none}}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .volume-selector:hover .volume-slider-container{display:flex}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .volume-selector .volume-slider-container{display:none;position:absolute;bottom:28px;padding:2px 4px;border-radius:4px;background-color:rgba(0,0,0,.5);transform-origin:0 100%;transform:rotate(270deg) translateY(100%)}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .volume-selector .volume-slider-container:hover{display:flex}.video-with-overlay-container .video-controller .control-container .resolution-speed-volume .volume-selector .volume-slider{height:16px;width:120px}.video-with-overlay-container .video-controller .control-container .control{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:32px;height:32px}