:root{--ink:#16233f;--ink-soft:#43567a;--ink-faint:#8794ad;--line:#16233f;--cream:#fff8e8;--paper:#fffdf6;--shade:rgba(22,35,63,.16);--red:#ff5b5b;--red-d:#d23636;--blue:#2f8dff;--blue-d:#1c63c9;--green:#34c95b;--green-d:#1f9b40;--yellow:#ffcb2e;--yellow-d:#e0a200;--purple:#a368f0;--purple-d:#7c3fcf;--orange:#ff944d;--orange-d:#df6c1e;--pink:#ff7bbf;--pink-d:#e24c9b;--appzon:#ff5b5b;--appzon-d:#d23636;--family:#2f8dff;--family-d:#1c63c9;--sky-1:#74c8ff;--sky-2:#3ba0ff;--r-card:24px;--r-btn:16px;--r-chip:999px;--maxw:880px;--font-d:"Baloo Thai 2","Sarabun",system-ui,sans-serif;--font-b:"Sarabun","Noto Sans Thai",system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body,html{margin:0;padding:0;overflow-x:hidden}body{font-family:var(--font-b);color:var(--ink);background:radial-gradient(circle at 12% 18%,hsla(0,0%,100%,.5) 0 1.5px,transparent 2px) 0 0 /34px 34px,radial-gradient(circle at 70% 60%,hsla(0,0%,100%,.4) 0 1.5px,transparent 2px) 0 0 /48px 48px,linear-gradient(180deg,var(--sky-1) 0,var(--sky-2) 100%);background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh}::-webkit-scrollbar{width:0;height:0}h1,h2,h3,h4{margin:0;line-height:1.1}button,h1,h2,h3,h4{font-family:var(--font-d)}button{cursor:pointer;border:none;background:none}input{font-family:var(--font-b)}.shell{max-width:var(--maxw);margin:0 auto;padding:0 14px 130px}.head-shell{padding-top:14px}.stack{display:flex;flex-direction:column}.panel{background:var(--paper);border:3px solid var(--line);border-radius:var(--r-card);box-shadow:0 6px 0 var(--shade)}.panel-cream{background:var(--cream)}.pop{background:var(--paper);border:3px solid var(--line);border-radius:20px;box-shadow:0 5px 0 var(--shade);transition:transform .12s ease,box-shadow .12s ease}.pop.tap:active{transform:translateY(3px);box-shadow:0 2px 0 var(--shade)}.btn3d{font-family:var(--font-d);font-weight:700;color:#fff;border:3px solid var(--line);border-radius:var(--r-btn);padding:13px 20px;font-size:22px;letter-spacing:.3px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-shadow:0 1.5px 0 rgba(0,0,0,.22);transition:transform .08s ease,box-shadow .08s ease,filter .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none}.btn3d:active{transform:translateY(5px)}.btn-red{background:var(--red);box-shadow:0 6px 0 var(--red-d),0 10px 14px rgba(0,0,0,.18)}.btn-blue{background:var(--blue);box-shadow:0 6px 0 var(--blue-d),0 10px 14px rgba(0,0,0,.18)}.btn-green{background:var(--green);box-shadow:0 6px 0 var(--green-d),0 10px 14px rgba(0,0,0,.18)}.btn-yellow{background:var(--yellow);box-shadow:0 6px 0 var(--yellow-d),0 10px 14px rgba(0,0,0,.18);color:var(--ink);text-shadow:0 1.5px 0 hsla(0,0%,100%,.4)}.btn-purple{background:var(--purple);box-shadow:0 6px 0 var(--purple-d),0 10px 14px rgba(0,0,0,.18)}.btn-orange{background:var(--orange);box-shadow:0 6px 0 var(--orange-d),0 10px 14px rgba(0,0,0,.18)}.btn-line{background:#06c755;box-shadow:0 6px 0 #04953f,0 10px 14px rgba(0,0,0,.18)}.btn-ghost{background:var(--cream);color:var(--ink);box-shadow:0 6px 0 var(--shade);text-shadow:none}.btn3d:active.btn-red{box-shadow:0 1px 0 var(--red-d)}.btn3d:active.btn-blue{box-shadow:0 1px 0 var(--blue-d)}.btn3d:active.btn-green{box-shadow:0 1px 0 var(--green-d)}.btn3d:active.btn-yellow{box-shadow:0 1px 0 var(--yellow-d)}.btn3d:active.btn-purple{box-shadow:0 1px 0 var(--purple-d)}.btn3d:active.btn-orange{box-shadow:0 1px 0 var(--orange-d)}.btn3d:active.btn-line{box-shadow:0 1px 0 #04953f}.btn3d:active.btn-ghost{box-shadow:0 1px 0 var(--shade)}.btn3d.lg{font-size:24px;padding:16px 26px}.btn3d.sm{font-size:19px;padding:9px 14px;border-radius:13px}.btn3d.block{width:100%}.btn3d.dim{filter:grayscale(.5) opacity(.55);pointer-events:none}.chip{font-family:var(--font-d);font-weight:600;border:2.5px solid var(--line);border-radius:var(--r-chip);padding:6px 13px;font-size:19px;background:var(--paper);color:var(--ink);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.chip.on-yellow{background:var(--yellow)}.chip.on-green{background:var(--green);color:#fff}.chip.on-red{background:var(--red);color:#fff}.chip.on-blue{background:var(--blue);color:#fff}.chip.on-purple{background:var(--purple);color:#fff}.chip.on-orange{background:var(--orange);color:#fff}.chip.on-pink{background:var(--pink);color:#fff}.chip.tapn{cursor:pointer}.starbadge{display:inline-flex;align-items:center;gap:6px;background:var(--yellow);color:var(--ink);border:3px solid var(--line);border-radius:999px;padding:5px 14px 5px 10px;font-family:var(--font-d);font-weight:800;box-shadow:0 4px 0 var(--yellow-d)}.starbadge .star{filter:drop-shadow(0 1px 0 var(--yellow-d))}.token{width:44px;height:44px;border-radius:50%;border:3px solid var(--line);display:grid;place-items:center;font-family:var(--font-d);font-weight:800;color:#fff;font-size:23px;flex:none;box-shadow:inset 0 -5px 0 rgba(0,0,0,.18),0 3px 0 var(--shade)}.track{height:16px;border:3px solid var(--line);background:#e9eef7;overflow:hidden}.track,.track>span{border-radius:999px}.track>span{display:block;height:100%}.seg{display:inline-flex;padding:5px;gap:5px;background:var(--cream);border:3px solid var(--line);box-shadow:0 5px 0 var(--shade);flex-wrap:wrap}.seg,.seg button{border-radius:999px}.seg button{font-family:var(--font-d);font-weight:700;padding:9px 14px;font-size:16px;color:var(--ink-soft);background:transparent;transition:.12s;white-space:nowrap}.seg button.active{color:#fff;text-shadow:0 1.5px 0 rgba(0,0,0,.2)}.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;justify-content:center;padding:10px 10px max(10px,env(safe-area-inset-bottom));pointer-events:none}.tabbar-inner{pointer-events:auto;display:flex;gap:1px;max-width:var(--maxw);width:100%;background:var(--cream);border:3px solid var(--line);border-radius:22px;box-shadow:0 6px 0 var(--shade),0 12px 24px rgba(0,0,0,.22);padding:5px;overflow-x:auto}.tabbtn{flex:1 1;min-width:0;border-radius:14px;padding:7px 1px 5px;display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--ink-soft);font-family:var(--font-d);font-weight:700;font-size:10.5px;transition:.12s;position:relative;white-space:nowrap}.tabbtn .ic{font-size:18px;line-height:1;transition:transform .15s}.tabbtn.active{color:#fff;text-shadow:0 1.5px 0 rgba(0,0,0,.2)}.tabbtn.active .ic{transform:translateY(-2px) scale(1.12)}.confetti-pc{position:fixed;top:-16px;width:12px;height:16px;z-index:999;pointer-events:none;border-radius:2px}.input{width:100%;border:3px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);font-size:17px;padding:13px 15px;outline:none;font-family:var(--font-b);box-shadow:inset 0 2px 0 var(--shade)}.input::placeholder{color:var(--ink-faint)}.err-pill{background:var(--red);box-shadow:0 4px 0 var(--red-d)}.err-pill,.ok-pill{color:#fff;border:3px solid var(--line);border-radius:14px;padding:10px 14px;font-family:var(--font-d);font-weight:700;font-size:16px}.ok-pill{background:var(--green);box-shadow:0 4px 0 var(--green-d)}.sheet-ov{position:fixed;inset:0;background:rgba(16,16,30,.6);z-index:150;display:flex;align-items:flex-end;justify-content:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.sheet{width:100%;max-width:540px;max-height:84vh;background:var(--paper);border:3px solid var(--line);border-radius:26px 26px 0 0;box-shadow:0 -6px 0 var(--shade);display:flex;flex-direction:column;overflow:hidden}.sheet-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:3px solid var(--line)}.tpgrid{display:grid;grid-template-columns:1fr 1fr;grid-gap:8px;gap:8px;padding:14px;overflow-y:auto}.tpcell{display:flex;align-items:center;gap:8px;border:3px solid var(--line);border-radius:14px;background:var(--paper);padding:10px 12px;font-family:var(--font-b);font-weight:600;font-size:15px;color:var(--ink);text-align:left}.tpcell.sel{background:var(--yellow)}.versus{height:30px;border:3px solid var(--line);border-radius:999px;overflow:hidden;display:flex;box-shadow:0 4px 0 var(--shade)}.versus>span{display:grid;place-items:center;color:#fff;font-family:var(--font-d);font-weight:800;font-size:16px;text-shadow:0 1.5px 0 rgba(0,0,0,.25)}.cdtile{background:var(--ink);color:#ffcb2e;border:3px solid var(--line);border-radius:14px;padding:8px 10px;min-width:62px;text-align:center;box-shadow:0 5px 0 rgba(0,0,0,.35)}.cdtile .n{font-family:var(--font-d);font-weight:800;font-size:clamp(28px,8.5vw,40px);line-height:1}.cdtile .u{font-size:12px;color:#fff;font-weight:700;margin-top:2px}.theme-toggle{font-family:var(--font-d);font-weight:800;font-size:15px;border:3px solid var(--line);background:var(--paper);color:var(--ink);border-radius:12px;padding:7px 11px;display:inline-flex;align-items:center;gap:6px;box-shadow:0 4px 0 var(--shade);cursor:pointer;white-space:nowrap}.theme-toggle:active{transform:translateY(3px);box-shadow:0 1px 0 var(--shade)}.row{display:flex;align-items:center}.gap6{gap:6px}.gap8{gap:8px}.gap10{gap:10px}.gap12{gap:12px}.gap16{gap:16px}.wrap{flex-wrap:wrap}.between{justify-content:space-between}.center{justify-content:center}.flex1{flex:1 1}.muted{color:var(--ink-soft)}.faint{color:var(--ink-faint)}.tiny{font-size:17px}.sm{font-size:18px}.mono{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.flag{font-size:31px;line-height:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.15))}.mb8{margin-bottom:8px}.mb12{margin-bottom:12px}.mb16{margin-bottom:16px}.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}@keyframes popIn{0%{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}@keyframes floaty{0%,to{transform:translateY(0) rotate(var(--rot,0deg))}50%{transform:translateY(-9px) rotate(var(--rot,0deg))}}@keyframes wobble{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes confettiFall{to{transform:translateY(105vh) rotate(2turn);opacity:1}}@keyframes glowPulse{0%,to{box-shadow:0 0 0 0 rgba(255,203,46,0),0 5px 0 var(--shade)}50%{box-shadow:0 0 22px 4px rgba(255,203,46,.55),0 5px 0 var(--shade)}}@keyframes diceRoll{0%{transform:rotate(0) scale(1)}25%{transform:rotate(-18deg) scale(1.1)}50%{transform:rotate(20deg) scale(1.12)}75%{transform:rotate(-10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}@keyframes livePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.72)}}.livedot{animation:livePulse 1s ease-in-out infinite}.fadeup{animation:popIn .4s cubic-bezier(.2,.9,.3,1.2) both}.floaty{animation:floaty 4s ease-in-out infinite}.wobble{animation:wobble 2.4s ease-in-out infinite}.glowwin{animation:glowPulse 2.2s ease-in-out infinite}.diceroll{animation:diceRoll .6s ease}.floatlayer{position:fixed;inset:0;pointer-events:none;z-index:8;overflow:hidden}.floatlayer .fitem{position:absolute;will-change:transform;opacity:.8}.floatlayer img.fav{width:100%;height:100%;border-radius:50%;border:3px solid var(--line);object-fit:cover;background:#fff;box-shadow:0 3px 0 var(--shade);display:block}@keyframes drift{0%{transform:translate(0) rotate(0deg)}25%{transform:translate(var(--dx1),var(--dy1)) rotate(7deg)}50%{transform:translate(var(--dx2),var(--dy2)) rotate(-6deg)}75%{transform:translate(var(--dx1),var(--dy2)) rotate(4deg)}to{transform:translate(0) rotate(0deg)}}.driftfun{animation:drift var(--dur,24s) ease-in-out infinite}@media (prefers-reduced-motion:reduce){.diceroll,.driftfun,.fadeup,.floaty,.glowwin,.livedot,.wobble{animation:none!important}}@media (min-width:760px){.shell{padding:0 20px 60px}.tabbar{top:0;bottom:auto;padding:14px 20px}.tabbar-inner{box-shadow:0 6px 0 var(--shade),0 14px 28px rgba(0,0,0,.18)}.head-shell{padding-top:112px}.tabbtn{font-size:17px;padding:9px 10px 7px}.tabbtn .ic{font-size:26px}.seg button{font-size:19px;padding:9px 16px}}@media (max-width:360px){.tabbtn{font-size:9.5px}.tabbtn .ic{font-size:16px}.shell{padding-left:10px;padding-right:10px}}body.theme-retro{--sky-1:#2a2c52;--sky-2:#14152b;--ink:#10101e;--line:#10101e;--cream:#fdf4d8;--paper:#fffaf0;--shade:rgba(16,16,30,.5);--font-d:"Sarabun",system-ui,sans-serif;background:repeating-linear-gradient(0deg,hsla(0,0%,100%,.03) 0 2px,transparent 2px 4px),repeating-linear-gradient(90deg,hsla(0,0%,100%,.03) 0 2px,transparent 2px 4px),linear-gradient(180deg,var(--sky-1),var(--sky-2))!important;background-attachment:fixed;image-rendering:pixelated}body.theme-retro:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9998;background:repeating-linear-gradient(180deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px),radial-gradient(120% 120% at 50% 50%,transparent 55%,rgba(0,0,0,.35) 100%);mix-blend-mode:multiply}body.theme-retro *{border-radius:0!important}body.theme-retro .mono,body.theme-retro .pixel,body.theme-retro .starbadge{font-family:Press Start\ 2P,Sarabun,monospace!important;letter-spacing:0!important}body.theme-retro .starbadge{font-size:14px;padding:8px 14px 7px 11px}body.theme-retro .starbadge .star{transform:scale(.85)}body.theme-retro .cdtile .n{font-family:Press Start\ 2P,Sarabun,monospace!important;font-size:clamp(20px,6.5vw,30px)}body.theme-retro .panel,body.theme-retro .pop,body.theme-retro .sheet{border:3px solid var(--line)!important;box-shadow:inset 3px 3px 0 hsla(0,0%,100%,.85),inset -3px -3px 0 rgba(16,16,30,.16),6px 6px 0 var(--shade)!important}body.theme-retro .panel-cream{background:var(--cream)!important}body.theme-retro .btn3d{border:3px solid var(--line)!important;text-shadow:2px 2px 0 rgba(0,0,0,.35)!important;box-shadow:inset 3px 3px 0 hsla(0,0%,100%,.45),inset -3px -3px 0 rgba(0,0,0,.25),5px 5px 0 var(--shade)!important}body.theme-retro .btn3d:active{transform:translate(3px,3px);box-shadow:inset 3px 3px 0 hsla(0,0%,100%,.3),inset -3px -3px 0 rgba(0,0,0,.25),1px 1px 0 var(--shade)!important}body.theme-retro .btn-yellow{text-shadow:2px 2px 0 hsla(0,0%,100%,.4)!important}body.theme-retro .chip{border:3px solid var(--line)!important;box-shadow:inset 2px 2px 0 hsla(0,0%,100%,.4),inset -2px -2px 0 rgba(0,0,0,.18),3px 3px 0 var(--shade)!important}body.theme-retro .seg{border:3px solid var(--line)!important;box-shadow:inset 2px 2px 0 hsla(0,0%,100%,.6),4px 4px 0 var(--shade)!important}body.theme-retro .seg button.active{box-shadow:inset 2px 2px 0 hsla(0,0%,100%,.4),inset -2px -2px 0 rgba(0,0,0,.22)!important}body.theme-retro .token{box-shadow:inset 3px 3px 0 hsla(0,0%,100%,.45),inset -3px -3px 0 rgba(0,0,0,.3)!important}body.theme-retro .track{border:3px solid var(--line)!important;background:#2a2c52!important;box-shadow:inset 2px 2px 0 rgba(0,0,0,.35)!important}body.theme-retro .track>span{background-image:repeating-linear-gradient(90deg,rgba(0,0,0,.18) 0 6px,transparent 6px 8px)!important}body.theme-retro .tabbar-inner{border:3px solid var(--line)!important;box-shadow:inset 3px 3px 0 hsla(0,0%,100%,.6),inset -3px -3px 0 rgba(0,0,0,.2),5px 5px 0 var(--shade)!important}body.theme-retro .tabbtn.active{text-shadow:1.5px 1.5px 0 rgba(0,0,0,.35)!important;box-shadow:inset 2px 2px 0 hsla(0,0%,100%,.4),inset -2px -2px 0 rgba(0,0,0,.25)!important}body.theme-retro .wobble{animation:none!important}body.theme-retro .floaty{animation:floaty 4s steps(6) infinite}body.theme-retro h1,body.theme-retro h2,body.theme-retro h3,body.theme-retro h4{text-shadow:3px 3px 0 rgba(16,16,30,.45)!important}body.theme-retro .theme-toggle{box-shadow:inset 2px 2px 0 hsla(0,0%,100%,.5),inset -2px -2px 0 rgba(0,0,0,.2),3px 3px 0 var(--shade)!important}