@import url("login_countdown_2_5_6_5.css?v=2565");
:root{--bg:#020916;--bg2:#06172d;--panel:#071a30;--panel2:#0a2441;--line:#17c8ff;--cyan:#5be7ff;--blue:#1d82ff;--text:#f3fbff;--muted:#8fb6d2;--green:#32f2a0;--danger:#ff5877;--tech:"Chakra Petch","Rajdhani","Segoe UI",Tahoma,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--tech);background:#020916;color:var(--text)}a{color:inherit}.login256-body{min-height:100vh;background:radial-gradient(circle at 15% -10%,rgba(24,119,255,.34),transparent 32%),radial-gradient(circle at 92% 5%,rgba(42,223,255,.15),transparent 28%),linear-gradient(180deg,#020815 0%,#06162b 52%,#020916 100%)}.login256-body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(55,218,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(55,218,255,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(#000,transparent 92%)}.login256-shell{position:relative;z-index:1;min-height:100vh}.login256-topbar{height:72px;display:flex;align-items:center;gap:24px;padding:0 clamp(14px,3vw,52px);background:rgba(3,15,33,.93);border-bottom:1px solid rgba(50,218,255,.22);backdrop-filter:blur(18px);position:sticky;top:0;z-index:40;box-shadow:0 12px 45px rgba(0,0,0,.38)}.login256-brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:310px}.login256-brand .brand-glyph{width:46px;height:46px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 100%,50% 78%,0 100%);background:linear-gradient(180deg,#fff 0%,#42dfff 70%,#0f7ef0 100%);color:#031226;font-size:22px;font-weight:1000;filter:drop-shadow(0 0 13px rgba(52,212,255,.72))}.login256-brand b{display:block;font-size:18px;letter-spacing:.08em}.login256-brand small{display:block;color:#78bfdf;font-size:9px;margin-top:2px}.login256-topbar nav{margin:auto;display:flex;gap:8px}.login256-topbar nav a{font-size:10px;text-decoration:none;font-weight:900;letter-spacing:.13em;color:#a9d7ed;border:1px solid transparent;padding:10px 14px;border-radius:9px}.login256-topbar nav a:hover{border-color:rgba(52,214,255,.3);background:#082847;color:#fff}.login256-login-jump{font-size:10px;text-decoration:none;font-weight:1000;letter-spacing:.11em;padding:11px 16px;border-radius:10px;border:1px solid rgba(89,231,255,.68);background:linear-gradient(135deg,#075fbd,#08b0dc);box-shadow:0 0 25px rgba(23,188,255,.2)}.login256-layout{max-width:1880px;margin:auto;padding:18px clamp(10px,2vw,30px) 28px;display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:14px;align-items:start}.login256-content{min-width:0}.login256-login-wrap{position:sticky;top:90px}.login256-hero{min-height:310px;border:1px solid rgba(57,216,255,.35);border-radius:27px;overflow:hidden;position:relative;background:#06172d;box-shadow:0 24px 70px rgba(0,0,0,.45)}.login256-hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,10,24,.98) 0%,rgba(3,17,36,.87) 43%,rgba(3,17,36,.18) 78%,rgba(3,17,36,.55) 100%),url('../img/team-spirit-four-colors-256.webp') center/cover no-repeat;filter:saturate(1.05)}.login256-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 47%,rgba(77,228,255,.08) 48%,transparent 49%),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 64px);pointer-events:none}.login256-hero-copy{position:relative;z-index:2;max-width:740px;padding:42px 38px}.login256-hero-copy .eyebrow{display:inline-flex;align-items:center;gap:7px;color:#65e7ff;font-size:10px;font-weight:1000;letter-spacing:.16em}.login256-hero-copy .eyebrow i,.login256-panel header span i,.login256-sync i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 13px var(--green);animation:ui256Pulse 1.7s infinite}.login256-hero h1{font-size:clamp(39px,4.5vw,66px);line-height:1.03;margin:11px 0 13px;letter-spacing:-.025em;text-shadow:0 0 24px rgba(60,207,255,.32)}.login256-hero h1 strong{color:#60e8ff;font-weight:1000}.login256-hero p{max-width:650px;color:#a4c6db;font-family:Tahoma,"Noto Sans Thai",sans-serif;font-size:13px;line-height:1.75;margin:0}.login256-hero-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.login256-hero-actions a{font-size:10px;font-weight:900;text-decoration:none;padding:10px 14px;border-radius:9px;border:1px solid rgba(84,221,255,.27);background:#071e37;color:#99eaff}.login256-hero-actions a.primary{background:linear-gradient(135deg,#0b67cf,#05aeda);color:#fff;border-color:#57e4ff;box-shadow:0 0 22px rgba(16,161,255,.25)}.login256-public-status{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.login256-public-status span{font-size:8px;color:#72bfdc;letter-spacing:.08em}.login256-public-status span:first-child{color:#43f2a8}.login256-ranking-section{margin-top:13px;border-radius:22px;border:1px solid rgba(52,216,255,.22);background:linear-gradient(180deg,rgba(7,27,51,.94),rgba(3,13,27,.96));box-shadow:0 16px 45px rgba(0,0,0,.3);padding:15px}.login256-section-head{display:flex;justify-content:space-between;gap:16px;align-items:end;padding:3px 4px 12px}.login256-section-head span{font-size:9px;color:#59def8;letter-spacing:.16em;font-weight:1000}.login256-section-head h2{font-size:25px;margin:3px 0 1px}.login256-section-head p{font-family:Tahoma,"Noto Sans Thai",sans-serif;font-size:10px;color:#7ea6c0;margin:0}.login256-sync{display:flex;align-items:center;gap:7px;font-size:9px;color:#52eead;font-weight:900;border:1px solid rgba(50,242,160,.18);background:rgba(19,72,61,.22);padding:7px 10px;border-radius:999px}.login256-ranking-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.login256-rank{--team:#1f8dff;position:relative;min-height:350px;border:1px solid var(--team);border-radius:18px;overflow:hidden;background:linear-gradient(180deg,rgba(7,24,45,.45),#030b17 67%);box-shadow:0 15px 35px rgba(0,0,0,.37),0 0 18px color-mix(in srgb,var(--team) 25%,transparent);isolation:isolate}.login256-rank:after{content:"";position:absolute;inset:auto 0 0;height:56%;background:linear-gradient(180deg,transparent,rgba(1,7,15,.98));z-index:-1}.login256-rank-art{height:190px;overflow:hidden;background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--team) 30%,transparent),transparent 65%)}.login256-rank-art img{width:100%;height:100%;object-fit:cover;object-position:center 29%;display:block;transform:scale(1.03);transition:transform .45s ease}.login256-rank:hover .login256-rank-art img{transform:scale(1.08)}.login256-rank-top{position:absolute;top:10px;left:10px;right:10px;display:flex;justify-content:space-between;z-index:3}.login256-rank .place{display:flex;align-items:center;gap:6px;background:rgba(2,9,20,.86);border:1px solid var(--team);border-radius:10px;padding:5px 8px;box-shadow:0 0 13px rgba(0,0,0,.3)}.login256-rank.rank-1 .place{border-color:#ffca55;background:linear-gradient(135deg,#4c2c02,#1c1307)}.login256-rank .place small{font-size:8px;color:#bddef1}.login256-rank .place b{font-size:23px}.login256-rank .trend{font-size:8px;color:#4bf0aa;background:#05251e;border:1px solid rgba(75,240,170,.25);border-radius:999px;padding:5px 7px;height:max-content}.login256-rank-name{padding:8px 11px 0}.login256-rank-name b{display:block;font-size:18px}.login256-rank-name small{font-family:Tahoma,"Noto Sans Thai",sans-serif;font-size:8px;color:#8cb5ce}.login256-score{display:flex;justify-content:space-between;align-items:end;margin:8px 10px 0;padding:8px 9px;border-radius:10px;border:1px solid rgba(85,220,255,.17);background:rgba(1,8,18,.72)}.login256-score small{font-size:8px;color:#88b1cb}.login256-score strong{font-size:28px;color:#fff;text-shadow:0 0 16px var(--team)}.login256-rank-meta{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:6px 10px 0}.login256-rank-meta span{font-size:7px;color:#7ca6c0;background:rgba(255,255,255,.035);padding:5px 6px;border-radius:7px}.login256-rank-meta b{float:right;color:#dff8ff}.login256-medals{display:flex;justify-content:center;gap:4px;padding:7px 8px 10px}.login256-medals span{font-size:7px;background:rgba(255,255,255,.045);padding:4px 6px;border-radius:999px;color:#d9effb}.login256-no-data{grid-column:1/-1;min-height:190px;display:grid;place-items:center;border:1px dashed rgba(71,219,255,.35);border-radius:15px;color:#78a8c5}.login256-info-grid{display:grid;grid-template-columns:1.05fr .85fr 1fr;gap:9px;margin-top:11px}.login256-panel{min-height:220px;border-radius:17px;border:1px solid rgba(48,209,255,.2);background:linear-gradient(180deg,#071a30,#04101f);overflow:hidden;box-shadow:0 13px 35px rgba(0,0,0,.28)}.login256-panel header{display:flex;align-items:center;justify-content:space-between;padding:12px 13px 10px;border-bottom:1px solid rgba(65,212,255,.11)}.login256-panel header span{display:flex;align-items:center;gap:6px;font-size:8px;letter-spacing:.15em;color:#62def9;font-weight:1000}.login256-panel header h3{font-size:15px;margin:3px 0 0}.login256-panel header a{font-size:8px;text-decoration:none;color:#7ee9ff;border:1px solid rgba(79,218,255,.2);padding:6px 8px;border-radius:7px}.login256-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:8px;align-items:center;margin:6px 8px;padding:8px;border-radius:9px;background:#082039;border:1px solid rgba(255,255,255,.045)}.login256-row.live{border-color:rgba(255,76,111,.42);box-shadow:inset 3px 0 #ff4c6f}.login256-row time{font-size:10px;font-weight:1000;color:#65e4ff}.login256-row b{font-size:9px}.login256-row small{display:block;font-size:7px;color:#739db7}.login256-row em{font-style:normal;font-size:7px;color:#8eeaff;background:#0a3156;padding:4px 6px;border-radius:999px}.login256-live,.login256-live-empty{padding:24px 14px;text-align:center}.login256-live>small{font-size:8px;color:#5edff9}.login256-live>div{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin-top:15px}.login256-live>div span{font-size:9px;font-weight:1000}.login256-live>div span:before{content:"";display:block;height:5px;width:36px;border-radius:999px;background:var(--team);box-shadow:0 0 13px var(--team);margin:0 auto 6px}.login256-live>div b{font-size:31px;text-shadow:0 0 13px rgba(74,222,255,.55)}.login256-live-empty{display:grid;gap:5px;place-items:center;color:#799eb7}.login256-live-empty b{font-size:23px;color:#54def8;letter-spacing:.15em}.login256-result{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin:6px 8px;padding:8px;border-radius:9px;background:#082039}.login256-result b{font-size:9px}.login256-result small{display:block;font-size:7px;color:#779bb3}.login256-result strong{font-size:15px;color:#fff}.login256-empty{display:grid;place-items:center;min-height:150px;color:#7097b2;font-size:9px}.login256-login{position:relative;padding:22px;border-radius:21px;border:1px solid rgba(76,225,255,.42);background:linear-gradient(180deg,rgba(7,29,53,.97),rgba(2,10,21,.98));box-shadow:0 22px 65px rgba(0,0,0,.52),0 0 28px rgba(21,183,255,.12);overflow:hidden}.login256-login:before{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(65,221,255,.08),transparent 32%);pointer-events:none}.login256-login-badge{position:relative;z-index:1;font-size:8px;letter-spacing:.18em;color:#55e6ff}.login256-login-head{position:relative;z-index:1;display:flex;align-items:center;gap:10px;margin:13px 0 16px}.login256-login-head>span{width:45px;height:45px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,#0d73d6,#07335c);border:1px solid rgba(87,230,255,.46);font-size:24px;box-shadow:0 0 19px rgba(14,178,255,.2)}.login256-login-head b{display:block;font-size:17px;letter-spacing:.08em}.login256-login-head small{font-family:Tahoma,"Noto Sans Thai",sans-serif;color:#79abc7;font-size:9px}.login256-login form{position:relative;z-index:1}.login256-login label{display:block;font-size:9px;color:#a1c6dc;font-weight:800;margin-top:11px}.login256-login input{display:block;width:100%;margin-top:6px;padding:13px 12px;border-radius:10px;border:1px solid #28587f;background:#05172b;color:#fff;font-family:inherit;font-size:14px;outline:none}.login256-login input:focus{border-color:#55e6ff;box-shadow:0 0 0 3px rgba(51,214,255,.1)}.login256-login button{width:100%;margin-top:16px;padding:13px 15px;border:0;border-radius:10px;background:linear-gradient(135deg,#0d69dc,#08b5df);color:#fff;font-family:inherit;font-size:14px;font-weight:1000;letter-spacing:.03em;display:flex;justify-content:space-between;align-items:center;cursor:pointer;box-shadow:0 0 25px rgba(15,163,255,.3)}.login256-login button b{font-size:21px}.login256-error{position:relative;z-index:1;border:1px solid rgba(255,85,118,.45);background:#40101d;color:#ffc1cd;padding:9px 10px;border-radius:9px;font-family:Tahoma,sans-serif;font-size:10px}.login256-secure{position:relative;z-index:1;margin-top:12px;display:flex;justify-content:space-between;color:#4eeba7;font-size:7px}.login256-login>p{position:relative;z-index:1;font-family:Tahoma,"Noto Sans Thai",sans-serif;font-size:8px;color:#688ba5;line-height:1.6;margin:12px 0 0}.login256-footer{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;padding:14px 10px 24px;font-size:8px;color:#537b98;letter-spacing:.08em}.login256-footer b{color:#75b5d5}@keyframes ui256Pulse{0%{box-shadow:0 0 0 0 rgba(50,242,160,.6)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media(max-width:1400px){.login256-login-jump{display:none}.login256-layout{grid-template-columns:1fr}.login256-login-wrap{position:static;order:2}.login256-content{order:1}.login256-login{max-width:760px;margin:13px auto 0}.login256-topbar nav{display:none}.login256-login-jump{margin-left:auto}.login256-info-grid{grid-template-columns:1fr 1fr}.login256-result-panel{grid-column:1/-1}}
@media(max-width:900px){.login256-topbar{height:64px;padding:0 12px}.login256-brand{min-width:0}.login256-brand .brand-glyph{width:38px;height:38px}.login256-brand b{font-size:13px}.login256-brand small{display:none}.login256-login-jump{font-size:8px;padding:8px 9px}.login256-layout{padding:9px}.login256-hero{min-height:340px;border-radius:18px}.login256-hero-bg{background-position:65% center}.login256-hero-copy{padding:29px 20px;max-width:660px}.login256-hero h1{font-size:42px}.login256-ranking-section{padding:10px;border-radius:17px}.login256-ranking-grid{grid-template-columns:1fr 1fr;gap:7px}.login256-rank{min-height:320px;border-radius:14px}.login256-rank-art{height:180px}.login256-info-grid{grid-template-columns:1fr}.login256-result-panel{grid-column:auto}.login256-login{margin-top:10px;border-radius:17px}.login256-footer{padding-bottom:28px}}
@media(max-width:560px){.login256-topbar{height:59px}.login256-brand .brand-glyph{width:34px;height:34px}.login256-brand b{font-size:11px}.login256-login-jump{font-size:7px;padding:7px 8px}.login256-layout{padding:7px}.login256-hero{min-height:365px}.login256-hero-bg{background-position:74% center}.login256-hero-bg:after{content:""}.login256-hero-copy{padding:25px 15px}.login256-hero h1{font-size:34px}.login256-hero p{font-size:11px}.login256-hero-actions a{flex:1;text-align:center;padding:9px 8px;font-size:8px}.login256-public-status{gap:5px}.login256-public-status span{font-size:6px}.login256-section-head{align-items:start}.login256-section-head h2{font-size:20px}.login256-section-head p{font-size:8px}.login256-sync{font-size:7px;padding:6px 8px}.login256-ranking-grid{gap:5px}.login256-rank{min-height:278px}.login256-rank-art{height:142px}.login256-rank-top{top:6px;left:6px;right:6px}.login256-rank .place{padding:4px 6px}.login256-rank .place small{font-size:6px}.login256-rank .place b{font-size:17px}.login256-rank .trend{font-size:6px}.login256-rank-name{padding:6px 7px 0}.login256-rank-name b{font-size:13px}.login256-rank-name small{font-size:6px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.login256-score{margin:6px 6px 0;padding:6px}.login256-score small{font-size:6px}.login256-score strong{font-size:20px}.login256-rank-meta{margin:4px 6px 0;gap:3px}.login256-rank-meta span{font-size:6px;padding:4px}.login256-medals{padding:5px 4px 7px;gap:2px}.login256-medals span{font-size:5.5px;padding:3px 4px}.login256-panel{min-height:190px}.login256-login{padding:17px}.login256-login-head b{font-size:15px}}
@media(prefers-reduced-motion:reduce){.login256-hero-copy .eyebrow i,.login256-panel header span i,.login256-sync i{animation:none!important}.login256-rank-art img{transition:none}}
