.fgr{--fg-ink:#13201B;--fg-line:#D9E2DE;--fg-lime:#C8F03C}
.fgr-fig{margin:28px 0;background:#0f1714;border-radius:16px;padding:18px 18px 12px;color:#E7EEEA}
.fgr-fig svg{display:block;width:100%;height:auto;max-height:360px;margin:0 auto}
.fgr-fig figcaption{font-size:15px;color:#A9BAB2;margin:10px 4px 2px;line-height:1.5}
.fgr-fig figcaption strong{color:#fff}
.fgr-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}
@media (max-width:620px){.fgr-row{grid-template-columns:1fr}}
.fgr-quick{background:#fff;border:2px solid var(--fg-ink);border-radius:14px;padding:20px 22px;margin:24px 0}
.fgr-quick h2{margin-top:0!important;font-size:22px!important}
.fgr-quick ol,.fgr-quick ul{margin-bottom:0}
.fgr-step{display:flex;gap:14px;align-items:flex-start;margin:26px 0 8px}
.fgr-step b{flex:none;width:34px;height:34px;border-radius:50%;background:var(--fg-lime);color:var(--fg-ink);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:17px;margin-top:2px}
.fgr-step h3{margin:0!important;font-size:22px!important}
.fgr-warn{background:#FFF6F3;border:1px solid #F1C9BC;border-left:4px solid #C2410C;border-radius:12px;padding:16px 18px;margin:22px 0;font-size:16.5px}
.fgr-warn p:last-child{margin:0}
.fgr-tip{background:#F6FBE6;border:1px solid #DDEFA5;border-left:4px solid #9FBF22;border-radius:12px;padding:16px 18px;margin:22px 0;font-size:16.5px}
.fgr-tip p:last-child{margin:0}
.fgr table{min-width:520px}
.fgr-related{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}
.fgr-related a{display:block;background:#fff;border:1px solid var(--fg-line);border-radius:12px;padding:16px 18px;text-decoration:none!important;font-weight:600;color:var(--fg-ink)}
.fgr-related a:hover{border-color:var(--fg-ink)}
.fgr-related small{display:block;font-weight:400;color:#55665F;font-size:14px;margin-top:4px}
@media (max-width:620px){.fgr-related{grid-template-columns:1fr}}

/* Charging */
.fgr-cable{animation:fgrPlug 6s ease-in-out infinite}
@keyframes fgrPlug{0%,8%{transform:translateY(70px)}26%,78%{transform:translateY(0)}92%,100%{transform:translateY(70px)}}
.fgr-glow{animation:fgrGlow 6s ease-in-out infinite}
@keyframes fgrGlow{0%,26%{opacity:0}32%,78%{opacity:1}86%,100%{opacity:0}}
.fgr-screen-on{animation:fgrScreen 6s ease-in-out infinite}
@keyframes fgrScreen{0%,26%{opacity:.25}32%,78%{opacity:1}86%,100%{opacity:.25}}
.fgr-n1{animation:fgrN1 6s steps(1) infinite}.fgr-n2{animation:fgrN2 6s steps(1) infinite}.fgr-n3{animation:fgrN3 6s steps(1) infinite}.fgr-n4{animation:fgrN4 6s steps(1) infinite}
@keyframes fgrN1{0%{opacity:1}40%{opacity:0}86%{opacity:1}}
@keyframes fgrN2{0%{opacity:0}40%{opacity:1}52%{opacity:0}}
@keyframes fgrN3{0%{opacity:0}52%{opacity:1}64%{opacity:0}}
@keyframes fgrN4{0%{opacity:0}64%{opacity:1}86%{opacity:0}}
.fgr-bar{transform-origin:0 50%;animation:fgrBar 6s ease-in-out infinite}
@keyframes fgrBar{0%,30%{transform:scaleX(.15)}76%{transform:scaleX(1)}86%,100%{transform:scaleX(.15)}}
.fgr-pulse{animation:fgrPulse 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes fgrPulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
.fgr-float{animation:fgrFloat 5s ease-in-out infinite}
@keyframes fgrFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.fgr-podmove{animation:fgrPod 7s ease-in-out infinite}
@keyframes fgrPod{0%,12%{transform:translateX(0)}30%,72%{transform:translateX(-46px)}90%,100%{transform:translateX(0)}}
.fgr-snap{animation:fgrSnap 7s ease-in-out infinite}
@keyframes fgrSnap{0%,12%{opacity:1}20%,82%{opacity:0}92%,100%{opacity:1}}
.fgr-vap{animation:fgrVap 7s ease-out infinite;opacity:0;transform-box:fill-box;transform-origin:center}
.fgr-vap.d2{animation-delay:.35s}.fgr-vap.d3{animation-delay:.7s}
@keyframes fgrVap{0%,36%{opacity:0;transform:translateY(0) scale(.6)}46%{opacity:.85}66%{opacity:0;transform:translateY(-40px) scale(1.6)}100%{opacity:0}}
.fgr-dust{animation:fgrDust 3.2s ease-out infinite;transform-box:fill-box}
.fgr-dust.d2{animation-delay:.4s}.fgr-dust.d3{animation-delay:.8s}
@keyframes fgrDust{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}70%{opacity:0;transform:translate(26px,18px)}100%{opacity:0}}
.fgr-brush{animation:fgrBrush 3.2s ease-in-out infinite}
@keyframes fgrBrush{0%,100%{transform:translateX(0)}25%{transform:translateX(-8px)}50%{transform:translateX(6px)}75%{transform:translateX(-5px)}}

/* Using */
.fgr-cap{animation:fgrCap 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes fgrCap{0%,20%{transform:translate(0,0) rotate(0);opacity:1}45%{transform:translate(36px,-34px) rotate(25deg);opacity:1}60%,85%{transform:translate(52px,-20px) rotate(40deg);opacity:0}100%{transform:translate(0,0);opacity:1}}
.fgr-capglow{animation:fgrCapGlow 5s ease-in-out infinite}
@keyframes fgrCapGlow{0%,45%{opacity:0}55%,85%{opacity:1}100%{opacity:0}}
.fgr-draw .fgr-v{animation:fgrDrawVap 4s ease-out infinite;opacity:0;transform-box:fill-box;transform-origin:center}
.fgr-draw .fgr-v.d2{animation-delay:.25s}.fgr-draw .fgr-v.d3{animation-delay:.5s}
@keyframes fgrDrawVap{0%,45%{opacity:0;transform:translateY(0) scale(.5)}55%{opacity:.9}85%{opacity:0;transform:translateY(-46px) scale(1.8)}100%{opacity:0}}
.fgr-draw .fgr-arrow{animation:fgrArrow 4s ease-in-out infinite}
@keyframes fgrArrow{0%{opacity:0;transform:translateY(10px)}15%,40%{opacity:1;transform:translateY(-6px)}50%,100%{opacity:0;transform:translateY(-14px)}}
.fgr-draw .fgr-wake{animation:fgrWake 4s ease-in-out infinite}
@keyframes fgrWake{0%,12%{opacity:.08}20%,80%{opacity:1}92%,100%{opacity:.08}}
.fgr-coil{animation:fgrCoil 4s ease-in-out infinite}
@keyframes fgrCoil{0%,12%{opacity:0}20%,42%{opacity:1}52%,100%{opacity:0}}
.fgr-press{animation:fgrPress 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes fgrPress{0%,18%{transform:translateX(0)}24%{transform:translateX(-4px)}30%,68%{transform:translateX(0)}74%{transform:translateX(-4px)}80%,100%{transform:translateX(0)}}
.fgr-finger{animation:fgrFinger 4s ease-in-out infinite}
@keyframes fgrFinger{0%,14%{transform:translateX(16px);opacity:0}20%,28%{transform:translateX(0);opacity:1}34%,64%{transform:translateX(16px);opacity:0}70%,78%{transform:translateX(0);opacity:1}84%,100%{transform:translateX(16px);opacity:0}}
.fgr-mode-a{animation:fgrModeA 4s steps(1) infinite}
.fgr-mode-b{animation:fgrModeB 4s steps(1) infinite}
@keyframes fgrModeA{0%{opacity:1}26%{opacity:0}76%{opacity:1}}
@keyframes fgrModeB{0%{opacity:0}26%{opacity:1}76%{opacity:0}}
.fgr-slide{animation:fgrSlide 5s ease-in-out infinite}
@keyframes fgrSlide{0%,15%{transform:translateY(0)}40%,60%{transform:translateY(34px)}85%,100%{transform:translateY(0)}}
.fgr-air-s{animation:fgrAirS 5s ease-in-out infinite}
.fgr-air-l{animation:fgrAirL 5s ease-in-out infinite}
@keyframes fgrAirS{0%,15%{opacity:1}30%,70%{opacity:0}85%,100%{opacity:1}}
@keyframes fgrAirL{0%,25%{opacity:0}40%,60%{opacity:1}75%,100%{opacity:0}}
.fgr-label-s{animation:fgrAirS 5s steps(1) infinite}
.fgr-label-l{animation:fgrAirL 5s steps(1) infinite}
.fgr-podin{animation:fgrPodIn 5s ease-in-out infinite}
@keyframes fgrPodIn{0%,10%{transform:translateX(-70px)}38%,85%{transform:translateX(0)}100%{transform:translateX(-70px)}}
.fgr-click{animation:fgrClick 5s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes fgrClick{0%,36%{opacity:0;transform:scale(.4)}42%{opacity:1}60%,100%{opacity:0;transform:scale(1.8)}}
.fgr-swap-out{animation:fgrSwapOut 7s ease-in-out infinite}
@keyframes fgrSwapOut{0%,10%{transform:translate(0,0);opacity:1}35%{transform:translate(-80px,-10px);opacity:0}100%{transform:translate(-80px,-10px);opacity:0}}
.fgr-swap-in{animation:fgrSwapIn 7s ease-in-out infinite}
@keyframes fgrSwapIn{0%,35%{transform:translate(-80px,0);opacity:0}45%{opacity:1}65%,92%{transform:translate(0,0);opacity:1}100%{transform:translate(0,0);opacity:0}}
.fgr-fade-flavor{animation:fgrFadeFlavor 6s ease-in-out infinite}
@keyframes fgrFadeFlavor{0%,20%{opacity:.95}70%,90%{opacity:.12}100%{opacity:.95}}
@media (prefers-reduced-motion:reduce){.fgr *{animation:none!important}.fgr-vap,.fgr-dust,.fgr-draw .fgr-v{opacity:0}}

.fgr-slidex{animation:fgrSlideX 5s ease-in-out infinite}
@keyframes fgrSlideX{0%,15%{transform:translateX(0)}40%,60%{transform:translateX(60px)}85%,100%{transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){.fgr-slidex{animation:none!important}}
