
@media (min-width:1069px){
  .lapp .ap-hero[data-own="friendschoice"][data-show=own]{flex-direction:row;align-items:center;justify-content:center;column-gap:clamp(56px,6.5vw,120px);padding:clamp(24px,4svh,48px) max(6.25vw,(100vw - 1260px) / 2)}
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-w{width:clamp(420px,40.6vw,520px);flex:0 0 auto;margin:0;text-align:left}
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-head{justify-items:start}
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-head .actions{justify-content:flex-start}
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-n{font-size:clamp(64px,6vw,80px);line-height:1.05}
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-line{margin-left:0}
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-media{flex:0 1 560px;min-width:0;margin-top:0}
}
@media (min-width:735px) and (max-width:1068px){.lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-media{margin-top:48px;padding-bottom:56px}}

.fch{--rh:76px;--rg:8px;--av:60px;--cw:42px;--ch:58px;--chip:42px;--mhw:8px;--mhg:2.5px;--mhh:20px;--hint:#8c9db0;position:relative;width:min(100%,560px);margin:0 auto;font-family:var(--font-sans);color:#f2f4f7;text-align:left}
.fch-now *{transition:none!important}
.fch-glow{position:absolute;left:50%;top:56%;width:170%;height:130%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 85%,transparent),color-mix(in srgb,var(--c) 32%,transparent) 50%,transparent);pointer-events:none}
.fch-gold{position:absolute;left:50%;top:calc(var(--av) + 96px);width:130%;height:280px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(232,176,75,.22),transparent);opacity:0;transition:opacity 1.4s ease;pointer-events:none}
.fch-done .fch-gold{opacity:1}

.fch-ppl{position:relative;display:flex;justify-content:center;gap:22px;margin-bottom:26px}
.fch-p{position:relative;width:var(--av);height:var(--av);border-radius:50%;background:linear-gradient(var(--a),var(--b));display:grid;place-items:center;font:600 calc(var(--av) * .42)/1 var(--font-sans);color:#fff;filter:saturate(.25) brightness(.7);transform:scale(.88);transition:filter .5s ease,transform .6s cubic-bezier(.3,1.45,.5,1)}
.fch-p::before{content:"";position:absolute;inset:-6px;border-radius:50%;box-shadow:0 0 0 2px var(--a);opacity:0;transform:scale(.8);transition:opacity .4s ease,transform .55s cubic-bezier(.3,1.45,.5,1)}
.fch-p svg{width:calc(var(--av) * .5);height:calc(var(--av) * .5);display:block}
.fch-pf{display:grid;place-items:center}
.fch-p.fch-act,.fch-p.fch-ok-on{filter:saturate(1) brightness(1);transform:none}
.fch-p.fch-act{transform:scale(1.1)}
.fch-p.fch-act::before{opacity:1;transform:none}
.fch-ok{position:absolute;right:-2px;bottom:-2px;width:calc(var(--av) * .4);height:calc(var(--av) * .4);border-radius:50%;background:#2ea6ff;color:#fff;box-shadow:0 0 0 3px #000;display:grid;place-items:center;opacity:0;transform:scale(.3);transition:opacity .3s ease,transform .5s cubic-bezier(.3,1.6,.5,1)}
.fch-ok svg{width:72%;height:72%}
.fch-ok-on .fch-ok{opacity:1;transform:none}

.fch-card{position:relative;padding:20px 16px 16px;border-radius:30px;background:#17212b;box-shadow:0 0 0 1px rgba(255,255,255,.07),0 40px 90px -24px rgba(0,0,0,.7)}
.fch-hd{display:flex;flex-direction:column;gap:6px;padding:0 6px 16px}
.fch-q{font-size:23px;line-height:28px;font-weight:700;letter-spacing:-.02em}
.fch-st{display:grid;min-height:24px;font-size:14px;line-height:20px;color:var(--hint);transition:opacity .5s ease}
.fch-lk,.fch-pr{grid-area:1 / 1;display:flex;align-items:center;gap:8px;transition:opacity .45s ease,transform .5s cubic-bezier(.2,.8,.3,1)}
.fch-lk svg{width:16px;height:16px;flex:none}
.fch-pr{opacity:0;transform:translateY(8px)}
.fch-open .fch-lk{opacity:0;transform:translateY(-8px)}
.fch-open .fch-pr{opacity:1;transform:none;transition-delay:.22s}
.fch-as{display:inline-flex}
.fch-as i{position:relative;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.1);box-shadow:0 0 0 2px #17212b}
.fch-as i + i{margin-left:-6px}
.fch-as b{position:absolute;inset:0;border-radius:50%;background:linear-gradient(var(--a),var(--b));display:grid;place-items:center;color:#fff;font:600 11px/1 var(--font-sans);opacity:0;transform:scale(.4);transition:opacity .3s ease,transform .5s cubic-bezier(.3,1.5,.5,1)}
.fch-as svg{width:14px;height:14px}
.fch-as i.fch-in b{opacity:1;transform:none}

.fch-ls{position:relative;list-style:none;margin:0;padding:0;height:calc(5 * var(--rh) + 4 * var(--rg));transition:opacity .5s ease}
.fch-fade .fch-ls,.fch-fade .fch-st{opacity:0}
.fch-r{position:absolute;left:0;right:0;top:0;z-index:1;min-height:var(--rh);display:grid;grid-template-columns:22px var(--cw) minmax(0,1fr) auto;align-items:center;column-gap:14px;padding:8px 18px 8px 12px;border-radius:18px;background:#222e3b;transform:translateY(var(--y,0px)) scale(var(--s,1));transition:transform .8s cubic-bezier(.3,1.12,.4,1)}
.fch-r::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;box-shadow:0 14px 34px rgba(0,0,0,.55);opacity:0;transition:opacity .4s ease}
.fch-r.fch-up{--s:1.03;z-index:3}
.fch-r.fch-dn{--s:.97;z-index:0}
.fch-r > :not(.fch-fl){transition:opacity .35s ease}
.fch-r.fch-dn > :not(.fch-fl){opacity:.45}
.fch-r.fch-up::after{opacity:1}
.fch-r::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1.5px rgba(232,176,75,.75),0 0 44px rgba(232,176,75,.22);opacity:0;transition:opacity .9s ease;pointer-events:none}
.fch-r.fch-win{--s:1.02;z-index:2}
.fch-r.fch-win::before{opacity:1}
.fch-fl{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(130px 70px at calc(100% - 44px) 50%,var(--f,#2ea6ff),transparent 75%);opacity:0;pointer-events:none}
.fch-sw{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.fch-sw::before{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,232,180,.14) 42%,rgba(255,232,180,.3) 50%,rgba(255,232,180,.14) 58%,transparent);transform:translateX(-120%)}
.fch-n{position:relative;font-size:17px;line-height:22px;font-weight:600;color:var(--hint);text-align:center;font-variant-numeric:tabular-nums;opacity:0;transition:opacity .4s ease}
.fch-open .fch-n{opacity:1}
.fch-win .fch-n{color:#e8b04b}
.fch-cv{position:relative;width:var(--cw);height:var(--ch);border-radius:9px;background:linear-gradient(var(--a),var(--b));display:grid;place-items:center;box-shadow:inset 0 0 0 .5px rgba(255,255,255,.2)}
.fch-cv b{font-size:calc(var(--cw) * .54);line-height:1;font-weight:700;letter-spacing:-.02em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.22)}
.fch-tx{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0}
.fch-t{font-size:18px;line-height:22px;font-weight:600;letter-spacing:-.01em;text-wrap:balance}
.fch-ln{display:grid;align-items:center;justify-items:start;height:26px}
.fch-mh,.fch-rb{grid-area:1 / 1}
.fch-mh{display:grid;grid-template-columns:repeat(10,var(--mhw));gap:var(--mhg);align-items:end;height:var(--mhh);transition:opacity .4s ease}
.fch-mh i{display:block;height:var(--mhh);border-radius:2px;background:#2ea6ff;transform-origin:50% 100%;transform:scaleY(.111);transition:transform .55s cubic-bezier(.3,1.35,.5,1)}
.fch-mh i.fch-z{background:rgba(255,255,255,.13)}
.fch-rb{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 11px 0 8px;border-radius:13px;background:rgba(232,176,75,.16);color:#e8b04b;font-size:13px;line-height:16px;font-weight:700;white-space:nowrap;opacity:0;transform:translateX(-10px);transition:opacity .5s ease .15s,transform .7s cubic-bezier(.2,.9,.3,1) .15s}
.fch-rb svg{width:14px;height:14px;flex:none}
.fch-win .fch-mh{opacity:0}
.fch-win .fch-rb{opacity:1;transform:none}
.fch-sc{position:relative;display:grid;justify-items:end;align-items:center;min-width:56px}
.fch-v,.fch-lock{grid-area:1 / 1}
.fch-v{display:flex;flex-direction:column;align-items:flex-end;opacity:0;transform-origin:100% 50%;transition:opacity .35s ease}
.fch-avg{font-size:26px;line-height:30px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.fch-k{font-size:12px;line-height:16px;color:var(--hint);white-space:nowrap}
.fch-lock{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.07);color:var(--hint);display:grid;place-items:center;transition:opacity .35s ease,transform .5s cubic-bezier(.3,1.45,.5,1)}
.fch-lock svg{width:18px;height:18px}
.fch-on .fch-v{opacity:1}
.fch-on .fch-lock{opacity:0;transform:scale(.5)}

.fch-fly{position:absolute;inset:0;z-index:5;pointer-events:none}
.fch-chip{position:absolute;left:0;top:0;width:var(--chip);height:var(--chip);border-radius:50%;background:linear-gradient(var(--a),var(--b));color:#fff;font:700 calc(var(--chip) * .48)/var(--chip) var(--font-sans);text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 8px 18px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,255,255,.28);opacity:0;will-change:transform}

@media (prefers-reduced-motion:no-preference){
  .ap-hero[data-own="friendschoice"] .fch{opacity:0;transform:translateY(40px)}
  .ap-hero[data-own="friendschoice"].in .fch{opacity:1;transform:none;transition:opacity 1s cubic-bezier(.05,0,.4,1) .45s,transform 1.1s cubic-bezier(.05,0,.4,1) .45s}
  .fch-win .fch-sw::before{animation:fchSweep 1.5s cubic-bezier(.45,0,.2,1) .4s both}
}
@keyframes fchSweep{to{transform:translateX(330%)}}

@media (max-width:734px){
  .lapp .ap-hero[data-own="friendschoice"][data-show=own] .ap-media{margin-top:32px;padding-bottom:40px}
  .fch{--rh:62px;--rg:6px;--av:46px;--cw:34px;--ch:48px;--chip:36px;--mhw:6px;--mhg:2px;--mhh:16px;width:min(100% - 32px,520px)}
  .fch-ppl{z-index:6;gap:18px;margin-bottom:calc(var(--av) * -.5)}
  .fch-p{box-shadow:0 0 0 4px #17212b}
  .fch-card{padding:calc(var(--av) * .5 + 14px) 10px 10px;border-radius:24px}
  .fch-hd{padding:0 6px 14px;gap:4px}
  .fch-q{font-size:19px;line-height:24px}
  .fch-st{font-size:13px;line-height:18px}
  .fch-r{grid-template-columns:18px var(--cw) minmax(0,1fr) auto;column-gap:10px;padding:6px 14px 6px 8px;border-radius:15px}
  .fch-cv{border-radius:7px}
  .fch-n{font-size:15px}
  .fch-t{font-size:16px;line-height:20px}
  .fch-tx{gap:5px}
  .fch-ln{height:22px}
  .fch-rb{height:22px;font-size:12px;padding:0 8px 0 6px;gap:4px}
  .fch-rb svg{width:13px;height:13px}
  .fch-sc{min-width:49px}
  .fch-avg{font-size:22px;line-height:26px}
  .fch-k{font-size:11px;line-height:14px}
  .fch-lock{width:30px;height:30px}
  .fch-lock svg{width:16px;height:16px}
  .fch-as i{width:20px;height:20px}
  .fch-as svg{width:12px;height:12px}
}
@media (max-width:379px){
  .fch{--rh:58px;--av:42px;--cw:30px;--ch:42px;--chip:32px;--mhw:5px}
  .fch-ppl{gap:16px}
  .fch-st{min-height:36px;font-size:12.5px;line-height:17px}
  .fch-r{column-gap:9px;padding:6px 12px 6px 6px}
  .fch-t{font-size:15px}
}
@media (max-width:359px){
  .fch-card{padding-left:8px;padding-right:8px;padding-bottom:8px}
  .fch-r{grid-template-columns:var(--cw) minmax(0,1fr) auto;padding:6px 10px 6px 8px}
  .fch-n{display:none}
  .fch-t{font-size:14px;line-height:18px}
}
