.pstage{position:relative;height:660px}
.pstage .ph{position:absolute;right:60px;top:0;transform:scale(.9);transform-origin:top right}
.pstage .float{position:absolute;border-radius:26px;padding:16px 18px;background:#fffffff5;transform:translateZ(120px);box-shadow:0 18px 40px #0e2a4f26}
.pstage .f1{left:-100px;top:150px;width:180px}
.pstage .f2{right:-40px;bottom:150px;width:180px}
.pstage .float .p{font-size:12px;font-weight:700;opacity:.7}
.pstage .float .n{font-family:Nunito;font-weight:900;font-size:30px;letter-spacing:-.03em;margin-top:2px}
.pstage .float .c{font-size:13px;font-weight:700}
.pstage .ph{width:340px;height:700px;border-radius:48px;overflow:hidden;box-shadow:0 30px 60px #0e2a4f38,0 0 0 9px #111;position:relative}
.pstage .ph .in{height:100%;padding:46px 12px 12px;display:flex;flex-direction:column}
.pstage .top{display:flex;align-items:center;padding:0 6px}
.pstage .top b{font-size:22px;letter-spacing:-.02em}
.pstage .top small{display:block;font-size:11px;opacity:.65;font-weight:500}
.pstage .top .ic{margin-left:auto;display:flex;gap:7px;align-items:center}
.pstage .top .ic span{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px}
.pstage .top .ic .inv{width:auto;padding:0 12px;border-radius:99px;font-size:12px;font-weight:800;background:var(--y);border:0}
.pstage .tools{display:flex;gap:6px;margin:11px 0 8px;overflow:hidden}
.pstage .tools div{flex:none;padding:8px 11px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap}
.pstage .list{flex:1;display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.pstage .row{flex:1;display:flex;align-items:center;border-radius:20px;padding:0 14px}
.pstage .row .f{font-size:27px;margin-right:11px}
.pstage .row i{font-style:normal;font-weight:800;font-size:17px;display:block}
.pstage .row em{font-style:normal;font-size:12px;opacity:.65}
.pstage .row .r{margin-left:auto;text-align:right}
.pstage .row .v{font-size:23px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.pstage .row .s{font-size:13px;opacity:.85;font-weight:500;margin-top:2px}
.pstage .row .s span{font-weight:700}
.pstage .row.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.pstage .row.on .v{font-size:31px;font-weight:800}
.pstage .up{color:var(--up)}
.pstage .dn{color:var(--dn)}
.pstage .keys{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:52px;gap:6px}
.pstage .keys div{border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:600}
.pstage .keys .op{background:linear-gradient(160deg,#dfe8f7d9,#e9eff999)}
.pstage .keys .eq{grid-row:span 2;background:var(--y);border:0}
@keyframes phonein{from{opacity:0;translate:0 70px;rotate:4deg}to{opacity:1;translate:0 0;rotate:0deg}}
.pstage{perspective:1400px}
.pstage .ph{animation:phonein 1.2s cubic-bezier(.2,.8,.2,1) .15s both;will-change:transform}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes popin{from{opacity:0;scale:.6}to{opacity:1;scale:1}}
.pstage .float{animation:popin .7s cubic-bezier(.3,1.5,.5,1) both,bob 6s ease-in-out infinite}
.pstage .f1{animation-delay:1s,1s}
.pstage .f2{animation-delay:1.25s,-2s}
.pstage .keys div{transition:transform .12s ease-out}
.pstage .keys div.hit{transform:scale(.86)}
.pstage .row{transition:background .4s,color .4s,border-color .4s}
.pstage .row.tap{animation:tap .35s ease-out}
@keyframes tap{50%{transform:scale(.97)}}
.pstage .stage{height:640px}
.pstage .stage .ph{right:50%;transform:translateX(50%) scale(.88);transform-origin:top center}
.pstage .float{display:none}
.pstage .ph.lightph{background:linear-gradient(180deg,#dfe4fb,#fdf6e6 60%,#fffdf8)}
.pstage .g{background:linear-gradient(160deg,#ffffffe0,#ffffff8f);border:1px solid #fff;box-shadow:inset 0 1px 0 #fff,0 8px 22px #0e2a4f12;color:var(--navy)}
.pstage .ph .in{color:var(--navy)}
.pstage .float{color:var(--navy)}
.pstage .f1{left:-60px}
.pstage .f2{right:-20px}
.pstage{height:520px;overflow:visible}
.pstage .ph{right:50%;translate:50% 0;transform:scale(.72)}
.pstage .float{display:none}
.pstage .list{display:flex;flex-direction:column;gap:6px;margin:0 0 8px;grid-template-columns:none}
.pstage .row{display:flex;flex:1;align-items:center;gap:0;padding:0 14px;border-radius:20px;transition:background .4s,color .4s}
.pstage .row .r{margin-left:auto;text-align:right;font-size:inherit}.pstage .row .f{font-size:27px;margin-right:11px}
.pstage .row.on{background:var(--navy);color:#fff}.pstage .ph{text-align:left}

.promo.gal{position:relative;overflow:visible}.pstage{position:relative;height:640px;min-width:0}.pstage .ph{position:absolute;right:40px;top:0;transform:scale(.88);transform-origin:top right}
@media(max-width:900px){.pstage{height:540px}}
