:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--water:#14294a;--water-deep:#0d1424;--frog:#8bd14f;--ink:#e9eef6;--panel:#121722;--card:#1d212c;--raised:#272c36;--sunk:#0c0f16;--bar:#8bd14f;--bar-ink:#0e1a10;--bar-shade:#51792e;--bar-low:#ff7a66;--lotus:#f28db2;--muted:#9aa6bc;--line:#3a3e48;--me:#8bd14f29;--font-ui:"Mitr", "Noto Sans Thai", "Leelawadee UI", Tahoma, sans-serif;--font-display:var(--font-ui);--pebble:22px 26px 24px 28px / 26px 22px 28px 24px}*,:before,:after{box-sizing:inherit}html,body{height:100%;margin:0}body{background:var(--panel);color:var(--ink);font-family:var(--font-ui);-webkit-user-select:none;user-select:none;flex-direction:column;display:flex;overflow:hidden}button{font:inherit}button:focus-visible{outline:3px solid var(--bar);outline-offset:2px}header{justify-content:space-between;align-items:center;gap:12px;padding:12px 18px 8px;display:flex}.headLeft{align-items:center;gap:10px;min-width:0;display:flex}.headAvatar{background:color-mix(in srgb, var(--ink) 10%, transparent);cursor:pointer;border:0;border-radius:22%;flex:none;place-items:center;width:42px;height:42px;padding:4px;transition:transform .12s;display:grid}.headAvatar:hover{transform:scale(1.06)}.headAvatar .frogSvg{width:100%;height:100%}.title{flex-direction:column;min-width:0;display:flex}h1{font-family:var(--font-display);letter-spacing:.3px;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1.2rem;font-weight:400;overflow:hidden}.who{color:var(--muted);cursor:pointer;text-align:left;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:0;padding:0;font-size:.85rem;overflow:hidden}.who b{color:var(--ink);font-weight:600}#whoLabel:empty{display:none}.scores{flex:none;align-items:center;gap:14px;display:flex}.score{font-family:var(--font-display);font-variant-numeric:tabular-nums;text-align:right;min-width:2ch;font-size:2.1rem;font-weight:400;line-height:1}.best{color:var(--muted);font-size:.9rem}.soundBtn{background:color-mix(in srgb, var(--ink) 10%, transparent);width:36px;height:36px;color:var(--ink);cursor:pointer;border:0;border-radius:50%;flex:none;font-size:1rem}.soundBtn[aria-pressed=true]{opacity:.6}.langBtn{font:600 .78rem/1 var(--font-ui);letter-spacing:.02em}.boardBtn{background:color-mix(in srgb, var(--ink) 10%, transparent);color:var(--ink);cursor:pointer;border:0;border-radius:999px;padding:7px 12px;font-size:.9rem;display:none}main{flex:1;gap:12px;min-height:0;padding:0 12px;display:flex}.game{flex-direction:column;flex:1;min-width:0;padding-bottom:12px;display:flex}.timer{background:color-mix(in srgb, var(--ink) 12%, transparent);border-radius:4px;height:8px;margin:0 6px 10px;overflow:hidden}.timer i{background:var(--bar);transform-origin:0;width:100%;height:100%;display:block}.timer i[data-kind=low]{background:var(--bar-low)}.timer i[data-kind=progress]{background:var(--frog)}.stage{background:var(--water);border-radius:18px;flex:1;min-height:0;position:relative;overflow:hidden}.stage>canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.overlay{z-index:1;text-align:center;color:#fff;background:color-mix(in srgb, var(--water-deep) 78%, transparent);flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:24px;display:flex;position:absolute;inset:0;overflow:auto}.overlay[hidden]{display:none}.overlay h2{font-family:var(--font-display);margin:0;font-size:1.9rem;font-weight:400;line-height:1.3}.overlay p{opacity:.92;max-width:34ch;margin:0;line-height:1.6}.overlay p:empty{display:none}.overSteps{justify-content:center;align-items:baseline;gap:8px;line-height:1;display:flex}.overSteps[hidden]{display:none}.overSteps b{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:5.5rem;font-weight:400}.overSteps span{font-family:var(--font-display);opacity:.85;font-size:1.3rem}.keys{grid-template-columns:repeat(3,34px);gap:4px;margin:4px 0;display:inline-grid}.keys span{background:var(--raised);height:34px;box-shadow:0 3px 0 var(--sunk);border-radius:9px;place-items:center;display:grid}.keys span:empty{background:0 0}.field{flex-direction:column;align-items:center;gap:6px;margin-top:6px;display:flex}.field label,.field .label{opacity:.85;font-size:.9rem}.field input{font:inherit;color:#fff;text-align:center;-webkit-user-select:text;user-select:text;background:#ffffff1f;border:2px solid #ffffff59;border-radius:12px;width:min(240px,70vw);padding:9px 14px;font-size:1.05rem}.field input::placeholder{color:#ffffff8c}.field input:focus{border-color:var(--bar);outline:none}.chips{flex-wrap:wrap;justify-content:center;gap:8px;max-width:340px;display:flex}.chip{color:#fff;cursor:pointer;background:#ffffff1a;border:2px solid #ffffff4d;border-radius:999px;align-items:center;gap:6px;padding:7px 12px;font-size:.9rem;display:flex}.chip[aria-pressed=true]{border-color:var(--bar);background:color-mix(in srgb, var(--bar) 20%, transparent)}.overlay button.main,.accountDlg button.main,.profilePage button.main,.confirmBtns .main,.newsBtns button.main{border-radius:var(--pebble);background:var(--bar);color:var(--bar-ink);font-family:var(--font-display);letter-spacing:.3px;cursor:pointer;box-shadow:0 5px 0 var(--bar-shade);border:0;font-weight:400;transition:transform 60ms,box-shadow 60ms}:is(.overlay,.accountDlg,.profilePage,.confirmBtns,.newsBtns) button.main:active:not(:disabled){box-shadow:0 1px 0 var(--bar-shade);transform:translateY(4px)}.overlay button.main{margin-top:8px;padding:12px 34px;font-size:1.15rem}.rankNote{opacity:.9;font-size:.9rem}.pad{--key:var(--raised);--key-edge:var(--sunk);z-index:1;pointer-events:none;grid-template-rows:repeat(2,64px);grid-template-columns:repeat(3,76px);justify-content:center;gap:10px;padding:0 0 18px;display:grid;position:absolute;bottom:0;left:0;right:0}.pad button{pointer-events:auto;border:1px solid var(--line);background:var(--key);color:var(--ink);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 5px 0 var(--key-edge);border-radius:18px 22px 16px;font-size:1.8rem;font-weight:600;transition:transform 60ms,box-shadow 60ms}.pad button:active{box-shadow:0 1px 0 var(--key-edge);transform:translateY(4px)}.pad button.hit{animation:.22s ease-out padHit}.pad button.wrong{animation:.4s ease-out padWrong}@keyframes padHit{0%{box-shadow:0 1px 0 var(--bar-shade);background:var(--bar);color:var(--bar-ink);transform:translateY(4px)scale(.94)}to{transform:none}}@keyframes padWrong{0%{background:var(--bar-low);color:#2a0a05;transform:translateY(4px);box-shadow:0 1px #9c3424}25%{background:var(--bar-low);color:#fff;transform:translate(-5px,2px)}50%{transform:translate(5px,1px)}75%{transform:translate(-3px)}to{transform:none}}.pad .u{grid-area:1/2}.pad .l{grid-area:2/1}.pad .d{grid-area:2/2}.pad .r{grid-area:2/3}@media (hover:hover) and (pointer:fine){.pad{grid-template-rows:repeat(2,44px);grid-template-columns:repeat(3,52px);gap:6px;padding:0 0 14px}.pad button{box-shadow:0 4px 0 var(--key-edge);border-radius:13px 15px 12px;font-size:1.2rem}}@media (prefers-reduced-motion:reduce){.pad button.hit,.pad button.wrong{animation-name:padFlash}@keyframes padFlash{0%{background:var(--bar);color:var(--bar-ink)}to{background:var(--key)}}.pad button.wrong{animation-name:padFlashWrong}@keyframes padFlashWrong{0%{background:var(--bar-low);color:#fff}to{background:var(--key)}}}aside{background:var(--card);border:1px solid var(--line);border-radius:18px;flex-direction:column;flex:none;width:340px;min-height:0;margin-bottom:14px;display:flex}aside h2{font-family:var(--font-display);justify-content:space-between;align-items:center;gap:8px;margin:0;padding:16px 16px 4px;font-size:1.05rem;font-weight:400;display:flex}.closeBtn{color:var(--muted);cursor:pointer;background:0 0;border:0;padding:0 4px;font-size:1.3rem;display:none}.tabs{gap:6px;padding:4px 12px 8px;display:flex}.tab{white-space:nowrap;border:1px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;flex:1;justify-content:center;align-items:center;gap:4px;padding:7px 8px;font-size:.8rem;display:flex}.tab[aria-pressed=true]{background:var(--raised);color:var(--ink);border-color:var(--line);box-shadow:0 2px 0 var(--sunk)}.sub{color:var(--muted);padding:0 16px 8px;font-size:.82rem}.list{flex:1;padding:0 8px 8px;overflow:auto}.row{border-bottom:1px dashed var(--line);border-radius:8px;grid-template-columns:2.2em 1fr auto;align-items:center;gap:8px;padding:8px;display:grid}.row .r{color:var(--muted);font-variant-numeric:tabular-nums;text-align:center}.row .n{align-items:center;gap:6px;min-width:0;display:flex}.row .nick{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.row .av{flex:none;width:28px;height:28px}.row .crown{flex:none}.row.top1,.row.top2,.row.top3{background:var(--raised);border-color:#0000;border-radius:16px 20px 18px 22px;margin-bottom:6px}.row.top1{box-shadow:0 3px 0 var(--sunk), inset 0 0 0 1.5px #f2c94c99}.row.top2{box-shadow:0 3px 0 var(--sunk), inset 0 0 0 1.5px #cfd4da73}.row.top3{box-shadow:0 3px 0 var(--sunk), inset 0 0 0 1.5px #dc9a6280}.row.top1 .nick,.row.top2 .nick,.row.top3 .nick{font-weight:600}.row.top1 .av{width:34px;height:34px}.row.top1 .s{font-size:1.1em}.row.me{background:var(--me);box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--bar) 55%, transparent);border-color:#0000}.row.me.top1{background:color-mix(in srgb, #f2c94c 20%, var(--raised));box-shadow:0 3px 0 var(--sunk), inset 0 0 0 1.5px #f2c94c}.row.me.top2{background:color-mix(in srgb, #cfd4da 16%, var(--raised));box-shadow:0 3px 0 var(--sunk), inset 0 0 0 1.5px #cfd4da}.row.me.top3{background:color-mix(in srgb, #dc9a62 18%, var(--raised));box-shadow:0 3px 0 var(--sunk), inset 0 0 0 1.5px #dc9a62}.row .r .medal{width:1.5em;height:1.5em}.row .s{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:400}.empty{color:var(--muted);text-align:center;padding:20px 12px;font-size:.9rem;line-height:1.6}@media (max-width:820px){.boardBtn{display:inline-flex}aside{z-index:10;width:auto;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);border-radius:0;margin:0;position:fixed;inset:0}aside:not(.open){display:none}.closeBtn{display:block}header .best{display:none}}.skinBtn{border:1px solid var(--line);background:var(--raised);color:var(--ink);box-shadow:0 3px 0 var(--sunk);cursor:pointer;border-radius:16px 20px 18px 22px;align-items:center;gap:8px;padding:8px 14px;font-size:.95rem;display:flex}.skinBtn .more{opacity:.75;margin-left:4px;font-size:.85rem}.picker{z-index:3;color:#fff;background:color-mix(in srgb, var(--water-deep) 94%, transparent);flex-direction:column;gap:12px;padding:16px;display:flex;position:absolute;inset:0;overflow:auto}.picker[hidden]{display:none}.pickerHead{justify-content:space-between;align-items:center;gap:12px;display:flex}.pickerHead h2{font-family:var(--font-display);margin:0;font-size:1.25rem;font-weight:400}.pickerClose{color:#fff;cursor:pointer;background:#ffffff1f;border:0;border-radius:50%;flex:none;width:40px;height:40px;font-size:1.1rem}.skinGrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}.skinCard{color:#fff;cursor:pointer;background:#ffffff0f;border:2px solid #ffffff38;border-radius:16px;flex-direction:column;align-items:stretch;gap:6px;padding:8px;font-size:.95rem;display:flex}.skinCard canvas{aspect-ratio:5/3;background:var(--water);border-radius:10px;width:100%;height:auto;display:block}.skinCard[aria-pressed=true]{border-color:var(--bar);background:color-mix(in srgb, var(--bar) 16%, transparent)}.skinCard .name{align-items:center;gap:6px;display:flex}.skinCard .tick{color:var(--bar);display:none}.skinCard[aria-pressed=true] .tick{display:inline-block}.skinSteps{color:var(--muted);margin:0 0 12px;font-size:.9rem}.skinCard.locked{cursor:default;border-style:dashed;border-color:#ffffff29}.skinCard.locked canvas{opacity:.55}.skinCard.locked .name{opacity:.75}.skinCard .lockIc{opacity:.8;width:1em;height:1em;margin-left:auto}.skinCard .need{color:var(--muted);text-align:left;font-size:.78rem}.skinCard .needBar{background:var(--sunk);border-radius:999px;height:5px;display:block;overflow:hidden}.skinCard .needBar i{background:var(--bar);border-radius:999px;height:100%;display:block}@media (max-width:420px){.skinGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}.ic{vertical-align:-.2em;flex:none;width:1.15em;height:1.15em;display:inline-block;overflow:visible}.pad button .ic{vertical-align:middle;width:1.15em;height:1.15em}.keys .ic{width:18px;height:18px}.overlay h2 .ic{vertical-align:-.1em;width:1em;height:1em}.boardTitle{white-space:nowrap;align-items:center;gap:6px;display:inline-flex}.boardBtn{align-items:center;gap:6px}.soundBtn{place-items:center;display:inline-grid}.soundBtn .ic{width:20px;height:20px}.closeBtn .ic,.pickerClose .ic{vertical-align:middle;width:20px;height:20px}.skinBtn .more{align-items:center;display:inline-flex}.skinBtn .more .ic{width:1em;height:1em}.account{flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 10px;margin-top:6px;font-size:.95rem;display:flex}.account[hidden],.field[hidden]{display:none}.linkBtn{color:var(--bar);font:inherit;cursor:pointer;text-underline-offset:3px;background:0 0;border:0;padding:4px 2px;font-weight:600;text-decoration:underline}.accountDlg .accStep{text-align:center;flex-direction:column;align-items:center;gap:10px;width:min(340px,100%);margin:8px auto 0;display:flex}.accountDlg .accStep[hidden]{display:none}.accountDlg p{opacity:.92;margin:0;line-height:1.6}.accountDlg input,.profilePage input{font:inherit;color:#fff;text-align:center;-webkit-user-select:text;user-select:text;background:#ffffff1f;border:2px solid #ffffff59;border-radius:12px;width:100%;padding:10px 14px;font-size:1.05rem}.accountDlg input::placeholder,.profilePage input::placeholder{color:#ffffff8c}.accountDlg input:focus,.profilePage input:focus{border-color:var(--bar);outline:none}.accountDlg button.main,.profilePage button.main{margin-top:2px;padding:10px 26px;font-size:1.05rem}.accountDlg button:disabled,.profilePage button:disabled{opacity:.6;cursor:wait}.accErr{color:#ffb4a8;min-height:1.6em;font-size:.9rem}.accHint{min-height:1.6em;font-size:.9rem}.accHint[data-ok=true]{color:#b9f0a0}.accHint[data-ok=false]{color:#ffb4a8}.accountDlg input[hidden],.accountDlg p[hidden]{display:none}.accTabs{width:100%;padding:0 0 4px}.accTabs .tab{color:#fff;border-color:#ffffff4d;padding:8px;font-size:.95rem}.accTabs .tab[aria-pressed=true]{color:var(--water-deep);background:#ffffffeb;border-color:#0000}.accNote{color:#ffd2c4;font-size:.85rem}.accSub{border-top:1px solid #ffffff26;flex-direction:column;align-items:center;gap:8px;width:100%;margin-top:10px;padding-top:12px;display:flex}.accountDlg button.ghost,.profilePage button.ghost{color:#fff;cursor:pointer;background:#ffffff14;border:2px solid #ffffff59;border-radius:999px;padding:8px 18px;font-size:.95rem}.profilePage{background:var(--panel)}.profBody{flex-direction:column;gap:12px;width:min(520px,100%);margin:0 auto;padding-bottom:8px;display:flex}.profCard{background:var(--card);border:1px solid var(--line);border-radius:20px 24px 22px 26px/24px 20px 26px 22px;flex-direction:column;align-items:stretch;gap:8px;padding:14px 16px;display:flex}.profCard h3{margin:0;font-size:1rem;font-weight:600}.profCard p{margin:0}.profCard button.main,.profCard button.ghost,.profCard .skinBtn{align-self:flex-start}.profCard .accHint:empty{display:none}.profCard h3+button{margin-top:-4px}.profTop{gap:12px}.profHead{flex-direction:row;align-items:center;gap:14px;display:flex}.profAvatar{background:#ffffff1f;border-radius:22%;flex:none;width:128px;height:128px;padding:12px}@media (max-width:420px){.profAvatar{width:104px;height:104px;padding:10px}}.profWho{min-width:0}.profNick{font-family:var(--font-display);text-overflow:ellipsis;white-space:nowrap;font-size:1.4rem;font-weight:400;overflow:hidden}.profSub{opacity:.75;overflow-wrap:anywhere;font-size:.85rem}.profStats>.loading,.profStats>p{margin:0;padding:16px;display:flex}#modes[hidden],#tabs[hidden],#viewTabs[hidden],.field[hidden]{display:none}#tabs:not([hidden])+#viewTabs{padding-top:0}.profilePage .linkBtn{align-self:center}.profPassFields{flex-direction:column;gap:8px;display:flex}.profPassFields[hidden],.profCard button[hidden]{display:none}.profPassBtns{align-items:center;gap:14px;display:flex}.profSignOuts{flex-wrap:wrap;justify-content:center;gap:4px 22px;display:flex}.loading{justify-content:center;align-items:center;gap:8px;display:inline-flex}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spin{animation:1.6s ease-in-out infinite spinFade}@keyframes spinFade{50%{opacity:.35}}}.boot{font-size:1.05rem}.boot .ic{width:1.6em;height:1.6em}.accountDlg button[aria-busy=true],.profilePage button[aria-busy=true]{opacity:1}.profAvatar{color:#fff;cursor:pointer;border:0;place-items:center;display:grid;position:relative}.profAvatar .frogSvg{width:100%;height:100%}.profAvatarEdit{background:var(--bar);width:32px;height:32px;color:var(--bar-ink);border:2px solid var(--panel);border-radius:50%;place-items:center;display:grid;position:absolute;bottom:-6px;right:-6px}.profAvatarEdit .ic{width:16px;height:16px}.profCard[hidden]{display:none}.profCardHead{justify-content:space-between;align-items:center;gap:12px;display:flex}.profCardHead .linkBtn{padding:0 2px}.frogColors{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}.frogColor{color:#fff;cursor:pointer;background:#ffffff0f;border:2px solid #ffffff2e;border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 6px;font-size:.82rem;display:flex}.frogColor .frogSvg{width:40px;height:40px}.frogColor[aria-pressed=true]{border-color:var(--bar);background:color-mix(in srgb, var(--bar) 16%, transparent)}@media (max-width:420px){.frogColors{gap:6px}.frogColor .frogSvg{width:34px;height:34px}header{gap:8px;padding:10px 12px 8px}.headLeft{gap:8px}.headAvatar{width:36px;height:36px;padding:3px}h1{font-size:1rem}.scores{gap:6px}.boardBtn{justify-content:center;align-items:center;width:34px;height:34px;padding:0}.boardBtn .boardLabel{display:none}.soundBtn{width:32px;height:32px}.score{font-size:1.7rem}#whoLabel{display:none}}.avatarImg{object-fit:cover;background:#ffffff26;border-radius:22%;display:block}:is(.headAvatar:has(.avatarImg),.profAvatar:has(.avatarImg)){padding:0}.headAvatar .avatarImg,.profAvatar .avatarImg{width:100%;height:100%}.profPhotoBtns{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.profCard h3+.profSub{margin-top:-4px}#profColorTitle{margin-top:6px}.avFrame{flex:none;display:block;position:relative}.avFrame .avInner{width:100%;height:100%;display:block}.avFrame .frameArt{pointer-events:none;width:128%;height:128%;position:absolute;inset:-14%}.headAvatar .avFrame,.profAvatar .avFrame{width:100%;height:100%}.headAvatar:has(.avFrame){background:0 0;padding:5px}.profAvatar:has(.avFrame){background:0 0;padding:15px}.titleChip{text-overflow:ellipsis;white-space:nowrap;max-width:9em;color:inherit;background:#f2c94c47;border:1px solid #f2c94cb3;border-radius:999px;flex:none;padding:1px 8px;font-size:.75rem;font-weight:600;line-height:1.5;display:inline-block;overflow:hidden}#profTitleChip:empty{display:none}#profTitleChip{margin:2px 0}.unlockNote{background:#f2c94c2e;border-radius:12px;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;padding:8px 14px;font-size:.92rem;display:flex}.unlockNote[hidden]{display:none}.unlockNote .ic{width:18px;height:18px;color:var(--bar)}.unlockNote .linkBtn{padding:0 2px}.row .nameBox{flex-direction:column;flex:auto;align-items:flex-start;gap:1px;min-width:0;display:flex}.row .nameLine{align-items:center;gap:6px;min-width:0;max-width:100%;display:flex}.row .nameBox .titleChip{max-width:100%;padding:0 6px;font-size:.68rem}.frameArt .tw,.medalArt .tw{transform-box:fill-box;transform-origin:50%;animation:2.4s ease-in-out infinite frameTwinkle}.frameArt .sheen{animation:2.6s linear infinite frameSheen}.medalArt.glow-gold,.frameArt.glow-gold{filter:drop-shadow(0 0 3px #ffc828bf)}.medalArt.glow-silver,.frameArt.glow-silver{filter:drop-shadow(0 0 3px #5aa0ffb3)}.medalArt.glow-bronze,.frameArt.glow-bronze{filter:drop-shadow(0 0 3px #ff6e3c99)}.profAvatar .frameArt[class*=glow-],.rewardPic .frameArt[class*=glow-]{filter:drop-shadow(0 0 6px #ffc82899)}.profAvatar .frameArt.glow-silver,.rewardPic .frameArt.glow-silver{filter:drop-shadow(0 0 6px #5aa0ff99)}.profAvatar .frameArt.glow-bronze,.rewardPic .frameArt.glow-bronze{filter:drop-shadow(0 0 6px #ff6e3c8c)}.avFrame.sq .avatarImg{border-radius:5%}.headAvatar:has(.sq){padding:8px}.profAvatar:has(.sq){padding:24px}.row .avFrame.sq{margin:8px 12px}@keyframes frameTwinkle{0%,to{opacity:0;scale:.3}45%{opacity:1;scale:1}60%{opacity:1;scale:1}}@keyframes frameSheen{0%{stroke-dashoffset:100px}to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.frameArt .tw,.medalArt .tw{opacity:.9;animation:none}.frameArt .sheen{opacity:0;animation:none}}.row .avFrame{margin:2px 6px}.boardHeadBtns{align-items:center;gap:6px;display:inline-flex}.rewardBtn{font:inherit;color:var(--ink);cursor:pointer;--gift-ribbon:var(--card);background:#f2c94c2e;border:1px solid #f2c94cb3;border-radius:999px;align-items:center;gap:4px;padding:4px 10px;font-size:.78rem;font-weight:600;display:inline-flex}.rewardBtn[hidden]{display:none}.rewardBtn .ic{color:#dcae2c;width:15px;height:15px}.rewardBtn:hover{background:#f2c94c4d}.seasonDlg{border:1px solid var(--line);background:var(--card);width:min(420px,100vw - 32px);max-height:calc(100dvh - 32px);color:var(--ink);border-radius:26px 30px 28px 32px/30px 26px 32px 28px;padding:18px 18px 16px;overflow:auto}.seasonDlg::backdrop{background:#0000008c}.confirmDlg{text-align:center;width:min(360px,100vw - 32px)}.confirmDlg h2{font-family:var(--font-display);margin:4px 0 8px;font-size:1.25rem;font-weight:400}.confirmDlg p{opacity:.9;margin:0;font-size:.95rem;line-height:1.5}.confirmBtns{justify-content:center;gap:10px;margin-top:18px;display:flex}.confirmBtns button{font:inherit;cursor:pointer;border-radius:16px 20px 18px 22px;padding:9px 22px;font-size:1rem}.confirmBtns .ghost{color:#fff;background:#ffffff14;border:2px solid #ffffff59}.confirmBtns .main{font-size:1.05rem}.confirmDlg[data-danger] .confirmBtns .main{color:#fff;background:#e5534b;box-shadow:0 5px #8f2b25}.seasonDlg .pickerHead{margin-bottom:6px}.seasonDlgIntro{opacity:.85;margin:0 0 14px;font-size:.9rem}.seasonDlgNote{opacity:.65;margin:14px 0 0;font-size:.8rem}.seasonRewards{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.seasonReward{background:#ffffff0f;border-radius:14px;align-items:center;gap:34px;padding:24px 14px 24px 34px;display:flex}.rewardPic{width:46px;height:46px}.seasonReward.tier-champion{padding-block:32px;background:#f2c94c33;gap:40px;padding-left:40px}.seasonReward.tier-champion .rewardPic{width:56px;height:56px}.seasonReward.tier-silver{background:#cfd4da24}.seasonReward.tier-bronze{background:#dc9a6224}.seasonRewardRank{font-size:1.02rem;font-weight:600}.seasonRewardName{opacity:.75;font-size:.85rem}.titleChip{align-items:center;gap:3px;display:inline-flex;position:relative;overflow:hidden}.titleChip .ic{flex:none;width:1.05em;height:1.05em}.titleChip.t1{color:#2e1608;background:linear-gradient(135deg,#f0c09a,#c98550);border-color:#f3c9a2}.titleChip.t2{color:#1d2733;background:linear-gradient(135deg,#fff,#cfd6de 45%,#8f99a4 60%,#e9edf2);border-color:#fff}.titleChip.t3{color:#3d2800;background:linear-gradient(135deg,#fff6c2,#f5cf4a 40%,#c08a16 62%,#f7d75e);border-color:#fff3b0;box-shadow:0 0 6px #ffc828a6}.titleChip.t3 .ic{color:#fff;filter:drop-shadow(0 0 2px #b07d12)}.titleChip.t4{color:#fff;text-shadow:0 1px 1px #00000059;background:linear-gradient(110deg,#6d3fd8,#d9469a,#f2b52a,#d9469a,#6d3fd8) 0 0/300% 100%;border-color:#ffd86b;animation:4s linear infinite titleLegend;box-shadow:0 0 8px #d9469ab3,0 0 2px #ffd86b}.titleChip.t2:after,.titleChip.t3:after,.titleChip.t4:after{content:"";background:linear-gradient(100deg,#0000,#ffffffbf,#0000);width:30%;animation:3.2s ease-in-out infinite titleShine;position:absolute;inset:-2px auto -2px -40%;transform:skew(-20deg)}.titleChip.t3:after{animation-duration:2.6s}.titleChip.t4:after{animation-duration:2.2s}@keyframes titleShine{0%,55%{left:-40%}to{left:130%}}@keyframes titleLegend{0%{background-position:0 0}to{background-position:300% 0}}@media (prefers-reduced-motion:reduce){.titleChip.t4{animation:none}.titleChip:after{display:none}}.hallList{flex-direction:column;gap:14px;display:flex}.hallEmpty{opacity:.8;text-align:center;padding:20px 4px}.hallSeason{background:#ffffff0f;border-radius:16px;padding:14px 14px 10px}.hallHead{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.hallHead h3{margin:0;font-size:1.05rem}.podium{text-align:center;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:4px;padding:30px 0 4px;display:grid}.podiumSpot{flex-direction:column;align-items:center;gap:4px;min-width:0;display:flex}.podiumPic{width:48px;height:48px;margin-bottom:24px}.podiumSpot.p1 .podiumPic{width:60px;height:60px;margin-bottom:30px}.podiumSpot.p1{padding-bottom:12px}.podiumName{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:.9rem;font-weight:600;overflow:hidden}.podiumVal{opacity:.75;font-variant-numeric:tabular-nums;font-size:.8rem}.hallRest{margin:8px 0 0;padding:0;list-style:none}.hallRest li{border-top:1px solid #ffffff14;grid-template-columns:2em 26px 1fr auto;align-items:center;gap:8px;padding:5px 4px;font-size:.88rem;display:grid}.hallRest .r{text-align:center;opacity:.7}.hallRest .nick{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.hallRest .s{font-variant-numeric:tabular-nums;font-weight:600}.hallPic{width:26px;height:26px}.newsDlg{text-align:center}.newsDlg h2{font-family:var(--font-display);margin:4px 0 0;font-size:1.45rem;font-weight:400}.newsPic{place-items:center;padding:56px 0 50px;display:grid}.newsFramePic{width:110px;height:110px}.newsText{flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;margin:0;font-size:1.05rem;display:flex}.newsText .medal{width:1.4em;height:1.4em}.newsPrize{color:#f2c94c;margin:6px 0 0;font-weight:600}.newsBtns{flex-direction:column;align-items:center;gap:6px;margin-top:14px;display:flex}.newsBtns button.main{padding:11px 30px;font-size:1.1rem}.newsBtns button[hidden]{display:none}.newsDlg[data-tier=champion]{box-shadow:0 0 0 2px #f2c94c,0 0 40px #f2c94c73}#hallBtn{padding:4px 7px}#newsMsg:empty{display:none}.titleChip.t3,.titleChip.t4{border-width:1.5px;font-weight:700}.itemTabs{gap:6px;display:flex}.itemTabs .tab{color:#fff;border-color:#ffffff40;font-size:.88rem}.itemTabs .tab[aria-pressed=true]{background:var(--bar);border-color:var(--bar);color:var(--bar-ink);box-shadow:none}.itemCount{opacity:.75;font-variant-numeric:tabular-nums;margin-left:6px;font-size:.78em}.itemGroups{flex-direction:column;gap:14px;display:flex}.itemGroup h4{opacity:.8;margin:4px 0 8px;font-size:.85rem;font-weight:600}.itemGrid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px;display:grid}.itemTile{color:#fff;font:inherit;cursor:pointer;text-align:center;background:#ffffff0f;border:2px solid #ffffff29;border-radius:14px;flex-direction:column;justify-content:flex-start;align-items:center;gap:6px;padding:12px 6px 10px;display:flex;position:relative}.itemTile:hover:not(:disabled){border-color:#fff6}.itemTile[aria-pressed=true]{border-color:var(--bar);background:color-mix(in srgb, var(--bar) 14%, transparent);cursor:default}.itemTile[aria-busy=true]{opacity:1}.itemTile:disabled:not(.locked){cursor:wait}.profilePage .itemTile.locked{cursor:not-allowed;opacity:1;border-style:dashed}.itemTile.locked .itemPrev{opacity:.45;filter:grayscale(.85)}.itemPrev{place-items:center;min-height:34px;display:grid}.frameTile .itemPrev{height:78px}.itemPic{width:44px;height:44px}.itemName{font-size:.8rem;font-weight:600;line-height:1.25}.itemGoal{opacity:.75;align-items:center;gap:3px;font-size:.72rem;line-height:1.25;display:inline-flex}.itemGoal .ic{flex:none;width:12px;height:12px}.itemNone{opacity:.6;border:1px dashed #ffffff59;border-radius:999px;padding:2px 8px;font-size:.75rem}.itemOn{background:var(--bar);width:20px;height:20px;color:var(--bar-ink);border-radius:50%;place-items:center;display:grid;position:absolute;top:6px;right:6px}.itemOn .ic{width:12px;height:12px}.itemEmpty{margin:0}#profItemsMsg:empty{display:none}@media (max-width:420px){.itemGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}.clickable{cursor:pointer}.row.clickable:hover,.hallRest li.clickable:hover{background:color-mix(in srgb, var(--ink) 7%, transparent)}.row:is(.top1,.top2,.top3).clickable:hover{background:color-mix(in srgb, var(--raised) 85%, white)}.row.me.clickable:hover{background:var(--me);filter:brightness(1.08)}.row.me.top1.clickable:hover{background:color-mix(in srgb, #f2c94c 20%, var(--raised))}.row.me.top2.clickable:hover{background:color-mix(in srgb, #cfd4da 16%, var(--raised))}.row.me.top3.clickable:hover{background:color-mix(in srgb, #dc9a62 18%, var(--raised))}.podiumSpot.clickable{border-radius:12px;padding-inline:4px}.podiumSpot.clickable:hover{background:#ffffff0f}.clickable:focus-visible{outline:2px solid var(--bar);outline-offset:1px}.cardDlg{width:min(440px,100vw - 32px);position:relative}.cardClose{z-index:1;position:absolute;top:12px;right:12px}.cardBody{flex-direction:column;gap:14px;display:flex}.cardHead{align-items:center;gap:18px;padding:8px 40px 0 4px;display:flex}.cardPicBox{flex:none;place-items:center;width:132px;height:132px;display:grid}.cardPic{width:84px;height:84px}.cardWho{flex-direction:column;align-items:flex-start;gap:4px;min-width:0;display:flex}.cardNick{font-family:var(--font-display);text-overflow:ellipsis;white-space:nowrap;max-width:100%;margin:0;font-size:1.4rem;font-weight:400;overflow:hidden}.cardEmpty{opacity:.8;text-align:center;margin:0;padding:16px 4px}.cardStats{grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;display:grid}.cardStat{background:#ffffff12;border-radius:14px;padding:12px 14px}.cardStatBest{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:1.5rem;font-weight:400}.cardStatRank{color:var(--bar);align-items:center;gap:4px;font-size:.92rem;font-weight:600;display:flex}.cardStatRank .medal{width:1.3em;height:1.3em}.cardSec h3{margin:0 0 8px;font-size:.95rem;font-weight:600}.cardSec p{margin:0}.cardResults{flex-direction:column;gap:8px;display:flex}.cardResult{background:#ffffff0f;border-radius:14px;align-items:center;gap:16px;padding:10px 12px 10px 16px;display:flex}.cardResult.top1{background:#f2c94c33}.cardResult.top2{background:#cfd4da24}.cardResult.top3{background:#dc9a6224}.cardResultRank{font-weight:600}.cardSkin{opacity:.85;align-items:center;gap:6px;margin:0;font-size:.9rem;display:flex}.cardSkin .ic{width:18px;height:18px}.cardEdit{font:inherit;color:#fff;cursor:pointer;background:#ffffff14;border:2px solid #ffffff59;border-radius:999px;align-self:center;padding:8px 18px;font-size:.95rem}@media (max-width:420px){.cardPicBox{width:108px;height:108px}.cardPic{width:68px;height:68px}.cardHead{gap:10px}}.bioBox{position:relative}.profilePage .bioBox input{text-align:left;background:var(--raised);border:0;border-radius:14px 18px 16px 20px;padding:10px 14px;font-size:.95rem}.profilePage .bioBox input:focus{box-shadow:0 0 0 2px var(--bar)}.bioCount{opacity:.6;font-variant-numeric:tabular-nums;pointer-events:none;font-size:.78rem;position:absolute;top:50%;right:14px;transform:translateY(-50%)}.profBioForm{flex-direction:column;gap:6px;display:flex}.profBioForm:is(:focus-within,.dirty) .bioBox input{padding-right:64px}.profBioForm:not(:focus-within):not(.dirty) :is(.bioCount,#profBioNote){display:none}.profBioBtns{align-items:center;gap:14px;display:flex}.profBioBtns[hidden]{display:none}.cardTop{flex-direction:column;gap:10px;display:flex}.cardBio{background:var(--raised);overflow-wrap:anywhere;border-radius:14px 18px 16px 20px;margin:0;padding:10px 14px;font-size:.95rem;line-height:1.45}.resultSummary{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.resultChip{background:#ffffff14;border-radius:999px;align-items:center;gap:3px;padding:3px 10px;font-size:.85rem;font-weight:600;display:inline-flex}.resultChip .medal{width:1.25em;height:1.25em}.resultChip.m1{background:#f2c94c38}.resultChip.m2{background:#cfd4da2e}.resultChip.m3{background:#dc9a622e}.cardResult.compact{gap:12px;padding:6px 10px 6px 14px}.resultMedal{flex:none;width:52px;height:62px}.resultMedalSm{flex:none;width:30px;height:36px}.cardResults:has(.compact){gap:6px;max-height:320px;padding-right:2px;overflow:auto}.cardMore{margin-top:6px;padding:2px}.cardStatBest .unit{opacity:.75;font-size:.6em;font-weight:600}.nickSetup{background:var(--panel);justify-content:center}.nickSetup h2{font-family:var(--font-display);margin:0;font-size:1.5rem;font-weight:400}.nickSetupPic{width:84px;height:84px}.nickSetupPic .frogSvg{width:100%;height:100%}.overFrog{flex:none;width:130px;height:130px}.gazeFrog{width:100%;height:100%;display:block}.gazeFrog .pupil{transition:transform .12s ease-out}.gazeFrog .eyeOpen{transform-box:fill-box;transform-origin:50%;transition:transform 70ms}.gazeFrog.blink .eyeOpen{transform:scaleY(.1)}.rankBox{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.rankBox[hidden]{display:none}.rankCard{background:var(--raised);border:2px solid var(--line);min-width:128px;box-shadow:0 4px 0 var(--sunk);border-radius:18px 22px 20px 24px;padding:10px 16px}.rankCard.top1{background:#f2c94c3d;border-color:#f2c94c}.rankCard.top2{background:#cfd4da33;border-color:#cfd4da}.rankCard.top3{background:#dc9a6233;border-color:#dc9a62}.rankLabel{opacity:.8;font-size:.82rem}.rankNum{font-family:var(--font-display);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;gap:4px;font-size:2rem;font-weight:400;line-height:1.2;display:flex}.rankNum span{opacity:.8;font-size:.45em;font-weight:600}.rankNum .medal{width:.8em;height:.8em}.rankBest{opacity:.8;font-size:.82rem}@media (max-height:640px){.overFrog{width:92px;height:92px}}.colorPreview{width:120px;height:120px;margin:4px auto 2px}@media (max-width:420px){.colorPreview{width:100px;height:100px}}.legalLink{color:inherit;opacity:.7;text-underline-offset:3px;align-self:center;font-size:.8rem}.legalLink:hover{opacity:1}.legalNote{opacity:.8;text-align:center;margin:0;font-size:.8rem}.legalNote a{color:inherit;text-underline-offset:3px}.legalNote[hidden]{display:none}.profilePage button.dangerBtn{color:#ffb4a8;border-color:#e5534bb3}.profilePage button.dangerBtn:hover:not(:disabled){background:#e5534b2e}.captcha{width:100%;min-height:65px}.captcha[hidden]{display:none}
