.ff-guide{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:24px 0;padding:24px;border:1px solid #60e2be55;border-radius:20px;background:radial-gradient(ellipse at 0 0,#38b18c25,transparent 75%),#101f2b;color:#e9f4fc;font:15px/1.6 system-ui}.ff-guide h2{font-size:clamp(23px,3vw,30px);line-height:1.15;margin:8px 0 12px;letter-spacing:-.035em}.ff-guide p{margin:0;color:#b9ccda;max-width:640px}.ff-guide small{display:block;font-size:10px;letter-spacing:.12em;font-weight:800;color:#8aefd0}.ff-guide-actions{display:grid;gap:10px;flex-shrink:0}.ff-guide a.ff-guide-primary,.ff-sticky a{padding:13px 20px;border-radius:11px;background:#83efd1;color:#09251e;font-weight:800;text-decoration:none;display:block;text-align:center}.ff-guide a.ff-guide-secondary{color:#b3f9e3;font-size:12px;text-align:center;text-decoration:underline;text-underline-offset:4px}.ff-sticky{position:fixed;z-index:40;bottom:0;left:0;right:0;display:none;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#091621ee;border-top:1px solid #5fc5ac55;backdrop-filter:blur(14px)}.ff-sticky button{background:none;border:0;color:#afc8d5;padding:12px;min-width:42px;cursor:pointer;font-size:20px}.ff-sticky a{flex:1;font-size:13px}.ff-guide-title{color:inherit}@media(max-width:650px){.ff-guide{flex-direction:column;align-items:stretch;padding:20px;gap:18px}.ff-guide-actions{width:100%}.ff-sticky:not([hidden]){display:flex;align-items:center;gap:8px}body.ff-has-guidance{padding-bottom:95px}}

.ff-screenshot-hero{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;gap:24px;margin:28px 0;padding:28px;border:1px solid #78f5d0;border-radius:24px;background:radial-gradient(ellipse at 0 0,#3bbfa340,transparent 70%),linear-gradient(135deg,#112d37,#0b1827);box-shadow:0 12px 40px #0003;color:#edfaff;font:15px/1.6 system-ui}.ff-screenshot-copy{min-width:0}.ff-screenshot-copy>small{font-size:9px;letter-spacing:.14em;color:#93f8d8;font-weight:800}.ff-screenshot-copy h2{font-size:clamp(28px,5vw,38px);letter-spacing:-.045em;line-height:1.05;margin:10px 0 14px}.ff-screenshot-copy p{font-size:13px;color:#bfd5df;margin:0 0 20px}.ff-screenshot-copy>a{display:block;padding:15px 16px;border-radius:12px;background:#8df1d1;text-align:center;color:#08251d;text-decoration:none;font-weight:800;font-size:14px;min-height:48px}.ff-screenshot-copy>span{display:block;font-size:10px;text-align:center;color:#accec9;margin-top:10px}.ff-photo-pair{position:relative;height:160px}.ff-photo-pair>div{position:absolute;inset:5px 38px 14px 0;border:1px solid #6fcfb699;border-radius:12px;background:#0d202c;transform:rotate(-9deg);padding:12px 8px;box-shadow:0 8px 20px #0006}.ff-photo-pair>div+div{inset:22px 0 0 35px;transform:rotate(8deg);background:#143e3b}.ff-photo-pair span{font-size:6px;letter-spacing:.06em;color:#8eefd1}.ff-photo-pair i{display:block;height:15px;margin-top:8px;border-radius:4px;background:linear-gradient(90deg,#8df1d177 18%,#426d7480 18%)}.ff-photo-pair>b{position:absolute;z-index:2;bottom:-4px;right:-5px;border:2px solid #aff9e4;border-radius:50%;width:44px;height:44px;background:#8df1d1;color:#0b3025;display:grid;place-content:center;font-size:26px}.ff-phone-preview .ff-guide [data-ff-preview]{display:none}@media(max-width:650px){.ff-screenshot-hero{grid-template-columns:1fr;padding:22px;gap:14px}.ff-photo-pair{width:135px;height:125px;margin:0 auto 4px}.ff-screenshot-copy h2{font-size:32px}.ff-screenshot-copy p{line-height:1.6}}@media(prefers-reduced-motion:no-preference){.ff-screenshot-hero:hover .ff-photo-pair>div{transform:rotate(-5deg) translateY(-3px);transition:transform .25s}.ff-screenshot-hero:hover .ff-photo-pair>div+div{transform:rotate(5deg) translateY(-3px)}}

.ff-guide.ff-guide-start{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(170px,.7fr) minmax(200px,.85fr);gap:26px;padding:28px;border-color:#9e9aff55;background:radial-gradient(ellipse at 12% 0,#6454d82e,transparent 62%),radial-gradient(ellipse at 100% 100%,#c4913820,transparent 65%),linear-gradient(125deg,#181b35,#111d2b);box-shadow:inset 0 1px #e0dcff0d,0 14px 35px #0002;isolation:isolate}.ff-guide-start>div{min-width:0}.ff-guide-start>div>small{color:#c4b8ff;font-size:9px;line-height:1.8}.ff-guide-start h2{color:#f6f0ff;font-size:clamp(24px,2.8vw,34px)}.ff-guide-start p{color:#bfc8e0;font-size:13px}.ff-lineup-caption{display:block;font-size:8px;letter-spacing:.12em;font-weight:800;text-align:center;color:#d1c4ff;margin-bottom:9px}.ff-lineup-faces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.ff-lineup-face{position:relative;height:53px;overflow:hidden;border-radius:11px;background:linear-gradient(145deg,#4e477750,#20334880);border:1px solid #c7bdff25}.ff-lineup-face img{width:100%;height:100%;object-fit:contain;object-position:center bottom;display:block;filter:drop-shadow(0 3px 5px #0005)}.ff-lineup-face span{position:absolute;bottom:3px;left:4px;font-size:7px;font-weight:850;line-height:1.5;padding:1px 4px;border-radius:4px;color:#e6e3ff;background:#0c142bd9;border:1px solid #ffffff15}.ff-guide-start a.ff-guide-primary{position:relative;isolation:isolate;overflow:hidden;min-height:52px;padding:15px 18px;border:1px solid #ffe8b2;border-radius:14px;background:linear-gradient(115deg,#ebbd67,#ffe3a0 48%,#f4c676);color:#282035;box-shadow:inset 0 1px 1px #fff9,inset 0 -2px 3px #ad6e2840,0 6px 24px #eac16a20;font-size:14px;transition:box-shadow .25s,transform .25s}.ff-guide-start a.ff-guide-primary::after{content:'';position:absolute;inset:-60% auto -60% -65%;width:35%;background:linear-gradient(90deg,transparent,#fff9,transparent);transform:skewX(-22deg);pointer-events:none}.ff-guide-start a.ff-guide-primary:hover{transform:translateY(-2px);box-shadow:inset 0 1px 1px #fff9,0 9px 28px #eac16a40}.ff-guide-start a.ff-guide-primary:focus-visible{outline:3px solid #c9baff;outline-offset:4px}.ff-guide-start a.ff-guide-secondary{color:#c4b8ed;font-size:11px;line-height:1.6}@media(prefers-reduced-motion:no-preference){.ff-guide-start a.ff-guide-primary{animation:ff-invite-breathe 7s ease-in-out infinite}.ff-guide-start a.ff-guide-primary::after{animation:ff-invite-shine 7s ease-in-out infinite}@keyframes ff-invite-shine{0%,65%{left:-65%;opacity:0}68%{opacity:.8}86%{left:140%;opacity:0}100%{left:140%;opacity:0}}@keyframes ff-invite-breathe{0%,70%,100%{translate:0 0}82%{translate:0 -2px}}}@media(max-width:900px){.ff-guide.ff-guide-start{grid-template-columns:minmax(0,1fr) minmax(150px,.65fr);gap:20px}.ff-guide-start .ff-guide-actions{grid-column:1/-1;max-width:400px;width:100%;justify-self:center}.ff-lineup-face{height:49px}}@media(max-width:650px){.ff-guide.ff-guide-start{grid-template-columns:1fr;padding:23px;gap:20px}.ff-guide-start .ff-guide-lineup{width:min(100%,270px);justify-self:center}.ff-guide-start .ff-guide-actions{grid-column:auto;max-width:none}.ff-lineup-face{height:58px}.ff-lineup-caption{font-size:8px}.ff-guide-start h2{font-size:29px}.ff-guide-start a.ff-guide-primary{min-height:54px}}

.ff-guide-start .ff-lineup-face{height:68px}.ff-guide-start .ff-lineup-winner{border-color:#ffdc8f;background:linear-gradient(145deg,#8e6e3650,#28334b);box-shadow:0 0 0 1px #fbdc8740}.ff-lineup-winner b{position:absolute;top:3px;right:5px;color:#ffdf8c;font-size:12px;line-height:1}.ff-guide-start .ff-guide-lineup{width:100%;max-width:300px;justify-self:center}@media(max-width:650px){.ff-guide-start .ff-guide-lineup{width:min(100%,300px)}.ff-guide-start .ff-lineup-face{height:76px}.ff-guide-start .ff-lineup-faces{gap:8px}.ff-guide-start .ff-lineup-face span{font-size:8px}}

.ff-guide-preview-hint{font-size:10px;line-height:1.7;color:#d1c4ee;text-align:center;max-width:260px;justify-self:center}.ff-guide-combined .ff-guide-actions{gap:12px}.ff-guide-combined [data-ff-preview]{display:block!important}.ff-guide-combined .ff-guide-secondary{margin-top:2px}@media(max-width:650px){.ff-guide-combined .ff-guide-preview-hint{font-size:11px;max-width:none}.ff-guide-combined .ff-guide-actions{gap:10px}}

.ff-guide-start .ff-guide-actions{gap:12px}.ff-guide-start a.ff-roster-preview-button,.ff-guide-start a.ff-roster-connect-button{display:flex;flex-direction:column;justify-content:center;gap:5px;min-height:84px;padding:15px 18px;line-height:1.4;text-align:left}.ff-guide-start a.ff-roster-preview-button{background:linear-gradient(115deg,#b9b1ff,#e0d7ff 48%,#a8c9ff);border-color:#e4dcff;color:#1c2242;box-shadow:inset 0 1px 1px #fff9,0 6px 24px #9c95f32a}.ff-guide-start a.ff-roster-preview-button:hover{box-shadow:inset 0 1px 1px #fff9,0 9px 28px #9c95f344}.ff-guide-start .ff-guide-actions a span{display:flex;justify-content:space-between;gap:12px;font-size:15px;font-weight:850;width:100%}.ff-guide-start .ff-guide-actions a small{color:inherit;font-size:11px;font-weight:500;letter-spacing:0;opacity:.85}.ff-guide-start .ff-guide-actions a b{font-size:17px}.ff-guide-start a.ff-roster-connect-button{animation:none}.ff-guide-start a.ff-roster-connect-button::after{animation:none;display:none}@media(max-width:650px){.ff-guide-start a.ff-roster-preview-button,.ff-guide-start a.ff-roster-connect-button{min-height:80px;padding:15px 18px}.ff-guide-start .ff-guide-actions a span{font-size:16px}.ff-guide-start .ff-guide-actions a small{font-size:12px}}

body>aside.ff-sticky{position:fixed;inset:auto 0 0;top:auto!important;margin:0;transform:none;translate:none;max-height:none;height:auto}body>aside.ff-sticky[hidden]{display:none!important}