:root{color-scheme:dark;--fg-bg:#070a1a;--fg-ink:#f0f3ff;--fg-muted:#aab7d1;--fg-gold:#ffd36e;--fg-cyan:#4ce5ff;font-family:'Trebuchet MS','Segoe UI',sans-serif}*{box-sizing:border-box}html{min-height:100%;background:var(--fg-bg)}body{margin:0;min-height:100vh;color:var(--fg-ink);background:radial-gradient(ellipse at 14% 20%,#16304488,transparent 52%),radial-gradient(ellipse at 85% 85%,#33214c66,transparent 48%),var(--fg-bg);overflow-x:hidden}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #8ceeff;outline-offset:4px}button:focus,a:focus,input:focus{outline-color:#8ceeff}[hidden]{display:none!important}.fg-sky{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}.fg-sky span{position:absolute;border:1px solid #819ac313;border-radius:50%;width:1000px;height:1000px;left:-430px;top:-650px;transform:rotate(-20deg)}.fg-sky span:nth-child(2){width:1500px;height:600px;left:-250px;top:-300px}.fg-sky span:nth-child(3){width:1200px;height:500px;left:60%;top:70%;border-color:#c2a9e514}.fg-header,.fg-main,.fg-footer{position:relative;z-index:1}.fg-header{max-width:1500px;margin:auto;padding:30px 48px;display:flex;align-items:center;justify-content:space-between}.fg-brand{display:flex;align-items:center;text-decoration:none;font-size:27px;font-weight:900;letter-spacing:.15em}.fg-brand svg{width:60px;height:60px;margin-right:13px;color:#a9bddb}.fg-brand small{display:block;color:var(--fg-gold);font-size:10px;letter-spacing:.55em;margin-top:4px}.fg-join-top{display:flex;align-items:center;min-height:44px;padding:12px 18px;border:1px solid #5c73975e;border-radius:999px;text-decoration:none;font-size:14px;font-weight:700;color:#c2d1eb}.fg-join-top span{margin-left:12px;color:var(--fg-gold)}.fg-main{max-width:1380px;margin:28px auto 45px;padding:0 48px;display:flex;align-items:center;justify-content:space-between}.fg-intro{width:51%;padding-right:70px}.fg-eyebrow,.fg-kicker{font-size:11px;font-weight:800;letter-spacing:.17em;color:#93d7e8}.fg-intro h1{font-size:53px;line-height:1.12;letter-spacing:-.035em;margin:22px 0}.fg-lead{text-align:center;margin-left:auto;margin-right:auto;font-size:20px;line-height:1.6;color:#b5c4dc;max-width:430px}.fg-scene{position:relative;height:230px;max-width:470px;margin:22px 0 24px;perspective:700px}.fg-orbit{position:absolute;left:10%;top:24%;width:80%;height:42%;border:1px solid #8bb7d845;border-radius:50%;transform:rotate(-18deg)}.fg-orbit-two{transform:rotate(18deg);border-color:#e7b4d32b}.fg-scene-star{position:absolute;left:44%;top:35%;font-size:46px;color:var(--fg-gold);text-shadow:0 0 45px #ffdb8277;animation:fg-star 6s ease-in-out infinite}.fg-scene-card{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100px;height:126px;border-radius:20px;border:1px solid #79b4d577;box-shadow:0 14px 35px #0005;animation:fg-float 5s ease-in-out infinite;background:linear-gradient(150deg,#25475d,#10243b)}.fg-scene-card span{font-size:45px;line-height:1.3}.fg-scene-card small{font-size:9px;font-weight:800;letter-spacing:.16em;margin-top:7px}.fg-card-one{left:3%;top:28%;transform:rotate(-12deg);color:#71edff}.fg-card-two{left:35%;top:8%;transform:rotate(7deg);color:#dfbaff;background:linear-gradient(150deg,#45315e,#1c1936);border-color:#ac8bd777;animation-delay:-1.5s}.fg-card-three{right:0;top:30%;transform:rotate(15deg);color:#ffdc8b;background:linear-gradient(150deg,#594736,#2c2233);border-color:#ddba7077;animation-delay:-3s}.fg-scene-dot{position:absolute;border-radius:50%;width:9px;height:9px;background:#4ce5ff;box-shadow:0 0 20px currentColor}.fg-dot-one{left:22%;top:3%;color:#4ce5ff}.fg-dot-two{left:56%;top:84%;width:6px;height:6px;color:#ee8bdf;background:#ee8bdf}.fg-dot-three{left:92%;top:15%;width:5px;height:5px;color:#ffd36e;background:#ffd36e}.fg-perks{flex-wrap:wrap;list-style:none;padding:0;margin:0;display:flex}.fg-perks li{width:50%;padding-right:18px}.fg-perks b{display:block;font-size:14px;line-height:1.5}.fg-perks .fg-perk-shared{width:100%;margin-top:14px;padding-right:0}.fg-perks span{display:block;color:#8fa3c4;font-size:13px;line-height:1.6;margin-top:3px}.fg-card{width:47%;max-width:510px;padding:34px 36px 25px;border:1px solid #62759655;border-top:3px solid var(--fg-gold);border-radius:28px;background:linear-gradient(150deg,#15213aee,#0d1429f5);box-shadow:0 24px 80px #0004;animation:fg-arrive .35s ease both}.fg-card-top{display:flex;justify-content:space-between;align-items:center}.fg-kicker{color:var(--fg-gold);font-size:10px}.fg-step{font-size:11px;color:#a3b4ce}.fg-card h2{font-size:30px;line-height:1.2;letter-spacing:-.025em;margin:17px 0 12px;overflow-wrap:break-word}.fg-card h2:focus{outline:none}.fg-description{color:var(--fg-muted);font-size:15px;line-height:1.6;margin:0 0 23px}.fg-label{display:block;font-size:13px;font-weight:700;line-height:1.5;margin:0 0 9px}.fg-card input{width:100%;min-height:54px;border:1px solid #61779888;border-radius:13px;background:#0b1327;color:#f6f8ff;font-size:17px;padding:14px 15px;transition:border-color .18s,box-shadow .18s}.fg-card input::placeholder{color:#7388aa;opacity:1}.fg-card input:focus{border-color:#5ee4ff;box-shadow:0 0 0 3px #41d0ff16}.fg-card input:disabled{opacity:.65}.fg-card input[readonly]{color:#becce0}.fg-button{display:flex;align-items:center;justify-content:center;width:100%;min-height:54px;padding:15px 20px;border-radius:13px;font-size:14px;line-height:1.4;font-weight:800;border:1px solid transparent;transition:transform .16s,background .16s,opacity .16s;text-decoration:none}.fg-button span{margin-left:auto;padding-left:14px;font-size:20px;line-height:1}.fg-primary{margin-top:17px;background:var(--fg-gold);color:#142036;box-shadow:0 5px 18px #ffd36e15}.fg-primary:hover:not(:disabled){background:#ffe199}.fg-secondary{background:#1b2b45;color:#d4e1f6;border-color:#52698d77;font-size:13px;min-height:48px;padding:12px 16px}.fg-button:active:not(:disabled){transform:translateY(1px)}.fg-button:disabled{opacity:.45;cursor:default}.fg-small{color:#8ea3c5;font-size:12px;line-height:1.65;margin:14px 0 0}.fg-honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.fg-check{min-height:0;margin-top:16px;max-width:100%}.fg-check:empty{display:none}.fg-check p{font-size:12px;line-height:1.5;color:#a3b7d5;margin:0 0 8px}.fg-check button{background:none;border:0;padding:8px 0;color:#83e6fb;text-decoration:underline;font-size:12px}.fg-check-mount{max-width:100%;overflow:hidden}.fg-code{font-size:29px!important;font-variant-numeric:tabular-nums;font-weight:800;letter-spacing:.38em;text-align:center;padding-left:calc(15px + .38em)!important}.fg-email-summary,.fg-account{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#c3d2e9;margin:0 0 22px}.fg-email-summary span,.fg-account span{overflow-wrap:anywhere;min-width:0;padding-right:10px;line-height:1.5}.fg-text-button{flex:none;background:none;border:0;color:#8be9ff;text-decoration:underline;text-underline-offset:3px;font-size:12px;min-height:40px;padding:8px 0 8px 8px}.fg-resend{margin-top:22px;padding-top:17px;border-top:1px solid #8aa2ca24}.fg-resend .fg-small{margin:0 0 10px}.fg-notice{margin:0 0 20px;padding:12px 14px;border:1px solid #75c4e54d;border-radius:12px;background:#15314777;color:#c4edff;font-size:13px;line-height:1.6;overflow-wrap:break-word}.fg-notice.is-error{border-color:#ed9c715e;background:#462c2a55;color:#ffd3b7}.fg-arcade{padding:19px;border:1px solid #7289b04f;border-radius:17px;background:#10233b;margin:0 0 15px}.fg-arcade-mark{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-bottom:13px;border-radius:12px;background:#2a4a5f;color:#a6f2ff;font-size:25px}.fg-arcade h3{font-size:20px;line-height:1.35;margin:0 0 7px;overflow-wrap:anywhere}.fg-arcade p{font-size:12px;line-height:1.6;margin:0;color:#9eb3d0}.fg-arcade .fg-button{margin-top:17px}.fg-footer{text-align:center;padding:8px 24px 25px;color:#667b9f;font-size:11px;letter-spacing:.04em}.fg-loading{display:flex;align-items:center;justify-content:center;min-height:150px;color:#a6bad7;font-size:14px}.fg-spinner{display:inline-block;width:21px;height:21px;margin-right:12px;border:2px solid #3f5b7d;border-top-color:#7ce4fb;border-radius:50%;animation:fg-spin .8s linear infinite}.fg-card[aria-busy="true"] .fg-primary{cursor:wait}.fg-preview-banner{position:relative;z-index:3;padding:10px;text-align:center;background:#513b23;color:#ffdfaa;font-size:13px;font-weight:700}
@keyframes fg-spin{to{transform:rotate(360deg)}}@keyframes fg-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes fg-float{0%,100%{margin-top:0}50%{margin-top:-8px}}@keyframes fg-star{0%,100%{opacity:.7}50%{opacity:1}}
@media(max-width:1050px){.fg-header{padding:25px 32px}.fg-main{padding:0 32px;margin-top:20px}.fg-intro{padding-right:35px;width:49%}.fg-intro h1{font-size:43px}.fg-lead{font-size:18px}.fg-card{width:49%;padding:30px 25px 23px}.fg-perks{display:block}.fg-perks li{width:100%;margin-bottom:13px}.fg-scene{height:200px}.fg-scene-card{width:85px;height:113px}}
@media(max-width:760px){.fg-header{padding:20px 23px}.fg-brand{font-size:23px}.fg-brand svg{width:47px;height:47px;margin-right:9px}.fg-brand small{font-size:8px}.fg-join-top{padding:10px 13px;font-size:12px}.fg-main{display:flex;flex-direction:column;align-items:stretch;padding:0 22px;margin:18px auto 25px;max-width:550px}.fg-intro{display:contents;width:100%;padding:0}.fg-eyebrow{font-size:10px;margin:0 0 13px}.fg-intro h1{font-size:37px;margin:0 0 12px}.fg-lead{font-size:16px;line-height:1.55;margin:0 auto 24px}.fg-scene{display:none}.fg-perks{display:block;order:2;margin:25px 3px 0}.fg-perks li{width:100%;padding:0;margin:0 0 17px}.fg-perks .fg-perk-shared{margin-top:0}.fg-perks b{font-size:14px}.fg-perks span{font-size:13px}.fg-card{order:1;width:100%;max-width:none;border-radius:23px;padding:27px 25px 21px}.fg-card h2{font-size:27px}.fg-card .fg-description{font-size:14px}.fg-footer{font-size:10px;padding-bottom:22px}.fg-code{font-size:27px!important}.fg-step{font-size:10px}}
@media(max-width:370px){.fg-header{padding:16px}.fg-brand{font-size:20px}.fg-brand svg{width:40px;height:40px}.fg-join-top{padding:8px 10px;font-size:11px}.fg-join-top span{margin-left:4px}.fg-main{padding:0 12px;margin-top:12px}.fg-intro{padding:0 4px}.fg-intro h1{font-size:32px}.fg-intro .fg-lead{font-size:14px;margin-bottom:19px}.fg-card{padding:23px 17px 18px}.fg-card h2{font-size:25px}.fg-code{font-size:25px!important;letter-spacing:.32em}.fg-check{margin-left:-5px;margin-right:-5px}#fg-email-check,#fg-code-check{margin-left:-10px;margin-right:-10px;max-width:none}#fg-email-check>p,#fg-code-check>p{padding:0 10px}}
@media(min-width:2400px){.fg-header{max-width:2800px;padding:65px 90px}.fg-brand{font-size:50px}.fg-brand svg{width:105px;height:105px;margin-right:25px}.fg-brand small{font-size:20px}.fg-join-top{font-size:25px;padding:23px 35px}.fg-main{max-width:2600px;padding:0 90px;margin-top:70px}.fg-intro{padding-right:130px}.fg-eyebrow{font-size:21px}.fg-intro h1{font-size:98px}.fg-lead{font-size:35px;max-width:830px}.fg-scene{max-width:850px;height:390px;margin:45px 0}.fg-scene-card{width:175px;height:225px;border-radius:30px}.fg-scene-card span{font-size:80px}.fg-scene-card small{font-size:17px}.fg-scene-star{font-size:85px}.fg-perks b{font-size:25px}.fg-perks .fg-perk-shared{width:100%;margin-top:14px;padding-right:0}.fg-perks span{font-size:23px}.fg-card{max-width:940px;padding:65px 65px 45px;border-radius:45px}.fg-kicker,.fg-step{font-size:20px}.fg-card h2{font-size:54px;margin:30px 0 23px}.fg-description{font-size:27px;margin-bottom:40px}.fg-label{font-size:24px;margin-bottom:16px}.fg-card input{min-height:95px;font-size:31px;padding:25px;border-radius:22px}.fg-button{min-height:95px;font-size:26px;padding:27px 35px;border-radius:22px}.fg-button span{font-size:36px}.fg-primary{margin-top:30px}.fg-small,.fg-check p{font-size:22px}.fg-check{margin-top:25px}.fg-code{font-size:50px!important}.fg-text-button,.fg-email-summary,.fg-account{font-size:22px}.fg-text-button{min-height:70px}.fg-resend{margin-top:35px;padding-top:30px}.fg-resend .fg-small{margin-bottom:20px}.fg-notice{font-size:24px;padding:22px 25px;margin-bottom:35px}.fg-arcade{padding:32px}.fg-arcade h3{font-size:36px}.fg-arcade p{font-size:22px}.fg-footer{font-size:20px;margin-top:50px}}
.fg-permission{font-size:12px;line-height:1.6;color:#c7dcf3;margin:-6px 0 17px;padding:10px 12px;border-left:2px solid #74cedc;background:#17324944;border-radius:0 8px 8px 0}.fg-rename-open{display:block;margin:5px 0 -4px auto;padding-left:8px;min-height:44px}.fg-manage-toggle{margin-top:18px}.fg-manager{border-top:1px solid #60779766;margin-top:20px;padding-top:18px}.fg-manager-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.fg-manager h3{font-size:20px;line-height:1.3;margin:0}.fg-manager h3:focus{outline:none}.fg-manager h4{font-size:14px;line-height:1.4;margin:0}.fg-manager-intro{margin:7px 0 20px}.fg-manager form .fg-secondary{margin-top:12px}.fg-email-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:25px 0 10px}.fg-email-heading>span{font-size:11px;white-space:nowrap;color:#a9c0df}.fg-family-emails{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}.fg-family-email{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:64px;padding:10px 12px;border:1px solid #59718f66;background:#10243a;border-radius:11px}.fg-family-email>div{min-width:0}.fg-family-email b{display:block;font-size:13px;line-height:1.4;overflow-wrap:anywhere}.fg-family-email span{display:block;font-size:11px;line-height:1.4;margin-top:3px;color:#9fb9d8}.fg-family-email .fg-text-button{min-height:44px}.fg-remove-confirm{background:#4a2a2b88;border:1px solid #e3a27c88;border-radius:13px;padding:13px;margin:15px 0}.fg-remove-confirm h4{font-size:16px;color:#ffe0ba}.fg-remove-confirm p{font-size:12px;line-height:1.55;margin:8px 0;overflow-wrap:anywhere;color:#f2d2c5}.fg-confirm-actions{display:flex;gap:7px;margin-top:12px}.fg-confirm-actions .fg-button{width:50%;min-height:48px;font-size:12px;padding:10px 7px}.fg-danger{background:#a84b48;color:#fff2e9;border-color:#f0aa84}.fg-danger:hover:not(:disabled){background:#bf5e56}.fg-add-panel{padding:17px 0 0;margin-top:16px;border-top:1px solid #60779755;animation:fg-arrive .2s ease both}.fg-add-panel>.fg-text-button{display:block;margin:8px auto 0}.fg-manager .fg-small{color:#a1b7d4}.fg-manager .fg-label{margin-top:4px}.fg-manager #fg-rename-form{padding:15px;border:1px solid #586f8e55;border-radius:13px;background:#0d1c30}.fg-manager #fg-rename-form input{min-height:48px}.fg-manager #fg-rename-form .fg-small{font-size:11px}.fg-manager .fg-email-summary{margin-bottom:15px}.fg-manager #fg-email-limit{margin-top:6px;color:#e1c58c}
@media(max-width:760px){.fg-manager h3{font-size:19px}.fg-manager .fg-manager-intro{font-size:12px}.fg-family-email{padding:9px 10px}.fg-family-email b{font-size:12px}.fg-family-email .fg-text-button{font-size:11px}.fg-manager #fg-rename-form{padding:12px}}
@media(max-width:370px){.fg-family-email{gap:5px}.fg-family-email b{font-size:12px}.fg-manager h3{font-size:18px}.fg-email-heading h4{font-size:13px}.fg-confirm-actions{flex-wrap:wrap}.fg-confirm-actions .fg-button{width:100%}.fg-manager #fg-rename-form{padding:10px}.fg-account{font-size:11px}.fg-permission{font-size:11px}}
@media(min-width:2400px){.fg-permission{font-size:23px;padding:18px 22px;margin-bottom:28px}.fg-manager{padding-top:30px;margin-top:34px}.fg-manager h3{font-size:36px}.fg-manager h4{font-size:27px}.fg-manager-intro{margin:14px 0 30px}.fg-email-heading{margin:38px 0 18px}.fg-email-heading>span{font-size:21px}.fg-family-emails{gap:12px}.fg-family-email{min-height:110px;padding:18px 22px}.fg-family-email b{font-size:24px}.fg-family-email span{font-size:20px}.fg-remove-confirm{padding:24px}.fg-remove-confirm h4{font-size:30px}.fg-remove-confirm p{font-size:22px}.fg-confirm-actions{gap:14px}.fg-confirm-actions .fg-button{font-size:22px;min-height:80px}.fg-manager #fg-rename-form{padding:26px}.fg-manager #fg-rename-form input{min-height:88px}.fg-manager #fg-rename-form .fg-small{font-size:21px}.fg-add-panel{padding-top:28px;margin-top:25px}.fg-manager .fg-email-summary{margin-bottom:25px}}
.fg-family-entry{justify-content:center;text-align:center;line-height:1.3;margin-top:4px;min-height:58px}.fg-family-help{margin-top:12px;line-height:1.65;color:#afc5df}.fg-coming-soon{margin-top:24px;padding:18px 18px 16px;border:1px solid #6e8bb345;border-radius:15px;background:linear-gradient(130deg,#1a345244,#12213988)}.fg-coming-badge{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.13em;color:#9cdce5}.fg-coming-soon h3{margin:9px 0 7px;font-size:19px;line-height:1.3;color:#e5efff}.fg-coming-soon p{margin:0;color:#9fb6d3;font-size:13px;line-height:1.65}.fg-coming-soon a{color:#acebff}@media(max-width:370px){.fg-family-entry{font-size:14px;min-height:56px;padding:13px 10px}.fg-coming-soon{padding:15px 13px;margin-top:20px}.fg-coming-soon h3{font-size:18px}.fg-coming-soon p{font-size:12px}}@media(min-width:2400px){.fg-family-entry{min-height:95px;margin-top:8px}.fg-family-help{margin-top:20px}.fg-coming-soon{padding:30px 32px;margin-top:40px;border-radius:25px}.fg-coming-badge{font-size:18px}.fg-coming-soon h3{font-size:34px;margin:16px 0 12px}.fg-coming-soon p{font-size:23px}}

/* Keep native document overflow as an accessibility escape at high text zoom
   and on short displays. Fit the welcome through layout, never clipped text. */
@media(min-width:900px){
 body[data-fg-step]{--fg-u:clamp(.65px,min(.052083333vw,.092592593vh),2px);display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;min-height:100svh}
 body[data-fg-step] .fg-header{width:100%;max-width:calc(1800 * var(--fg-u));padding:calc(24 * var(--fg-u)) calc(40 * var(--fg-u))}
 body[data-fg-step] .fg-brand{font-size:calc(27 * var(--fg-u))}
 body[data-fg-step] .fg-brand svg{width:calc(60 * var(--fg-u));height:calc(60 * var(--fg-u));margin-right:calc(13 * var(--fg-u))}
 body[data-fg-step] .fg-brand small{font-size:max(8px,calc(10 * var(--fg-u)))}
 body[data-fg-step] .fg-join-top{min-height:44px;font-size:max(12px,calc(14 * var(--fg-u)));padding:calc(10 * var(--fg-u)) calc(18 * var(--fg-u))}
 body[data-fg-step] .fg-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);align-items:center;gap:calc(90 * var(--fg-u));width:100%;max-width:calc(1680 * var(--fg-u));margin:0 auto;padding:calc(12 * var(--fg-u)) calc(40 * var(--fg-u))}
 body[data-fg-step] .fg-intro{display:block;width:auto;min-width:0;padding:0}
 body[data-fg-step] .fg-eyebrow{font-size:max(10px,calc(11 * var(--fg-u)));margin:0;line-height:1.5}
 body[data-fg-step] .fg-intro h1{font-size:calc(53 * var(--fg-u));line-height:1.12;margin:calc(17 * var(--fg-u)) 0}
 body[data-fg-step] .fg-lead{font-size:max(15px,calc(20 * var(--fg-u)));line-height:1.5;max-width:calc(460 * var(--fg-u));margin:0 auto}
 body[data-fg-step] .fg-scene{max-width:calc(470 * var(--fg-u));height:calc(180 * var(--fg-u));margin:calc(16 * var(--fg-u)) auto}
 body[data-fg-step] .fg-scene-card{width:calc(90 * var(--fg-u));height:calc(114 * var(--fg-u));border-radius:calc(18 * var(--fg-u))}
 body[data-fg-step] .fg-scene-card span{font-size:calc(40 * var(--fg-u))}
 body[data-fg-step] .fg-scene-card small{font-size:max(8px,calc(9 * var(--fg-u)))}
 body[data-fg-step] .fg-scene-star{font-size:calc(44 * var(--fg-u))}
 body[data-fg-step] .fg-perks{display:flex;margin:0;gap:0}
 body[data-fg-step] .fg-perks li{width:50%;padding-right:calc(18 * var(--fg-u));margin:0}
 body[data-fg-step] .fg-perks .fg-perk-shared{width:100%;margin-top:calc(12 * var(--fg-u));padding:0}
 body[data-fg-step] .fg-perks b{font-size:max(13px,calc(14 * var(--fg-u)));line-height:1.4}
 body[data-fg-step] .fg-perks span{font-size:max(12px,calc(13 * var(--fg-u)));line-height:1.5;margin-top:calc(3 * var(--fg-u))}
 body[data-fg-step] .fg-card{width:100%;max-width:calc(540 * var(--fg-u));justify-self:end;min-width:0;padding:max(20px,calc(30 * var(--fg-u))) max(20px,calc(34 * var(--fg-u)));border-radius:calc(27 * var(--fg-u))}
 body[data-fg-step] .fg-kicker{font-size:max(10px,calc(10 * var(--fg-u)))}
 body[data-fg-step] .fg-card h2{font-size:max(22px,calc(30 * var(--fg-u)));line-height:1.2;margin:calc(15 * var(--fg-u)) 0 calc(10 * var(--fg-u))}
 body[data-fg-step] .fg-description{font-size:max(14px,calc(15 * var(--fg-u)));line-height:1.5;margin:0 0 calc(18 * var(--fg-u))}
 body[data-fg-step] .fg-family-entry{min-height:max(48px,calc(56 * var(--fg-u)));padding:calc(14 * var(--fg-u)) calc(16 * var(--fg-u));margin-top:4px;border-radius:calc(13 * var(--fg-u));font-size:max(14px,calc(15 * var(--fg-u)))}
 body[data-fg-step] .fg-family-help{font-size:max(12px,calc(12 * var(--fg-u)));line-height:1.5;margin-top:calc(10 * var(--fg-u))}
 body[data-fg-step] .fg-coming-soon{margin-top:calc(20 * var(--fg-u));padding:calc(16 * var(--fg-u));border-radius:calc(15 * var(--fg-u))}
 body[data-fg-step] .fg-coming-badge{font-size:max(9px,calc(10 * var(--fg-u)))}
 body[data-fg-step] .fg-coming-soon h3{font-size:max(17px,calc(19 * var(--fg-u)));line-height:1.3;margin:calc(8 * var(--fg-u)) 0 calc(7 * var(--fg-u))}
 body[data-fg-step] .fg-coming-soon p{font-size:max(12px,calc(13 * var(--fg-u)));line-height:1.5}
 body[data-fg-step] .fg-footer{font-size:max(10px,calc(11 * var(--fg-u)));line-height:1.4;margin:0;padding:calc(16 * var(--fg-u)) calc(20 * var(--fg-u))}
}
@media(min-width:900px) and (max-height:650px){
 body[data-fg-step] .fg-scene{display:none}
 body[data-fg-step] .fg-perks{margin-top:18px}
 body[data-fg-step] .fg-coming-badge{display:none}
 body[data-fg-step] .fg-coming-soon h3{margin-top:0}
}

@media(min-width:900px){body[data-fg-step]{height:100vh;height:100svh}body[data-fg-step] .fg-main{min-height:0;height:100%}body[data-fg-step] .fg-card{max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}body[data-fg-step] .fg-label{font-size:max(12px,calc(13 * var(--fg-u)));margin:0 0 calc(8 * var(--fg-u))}body[data-fg-step] .fg-card input{min-height:max(44px,calc(52 * var(--fg-u)));font-size:max(15px,calc(17 * var(--fg-u)));padding:calc(12 * var(--fg-u)) calc(14 * var(--fg-u));border-radius:calc(13 * var(--fg-u))}body[data-fg-step] .fg-card .fg-code{font-size:max(24px,calc(29 * var(--fg-u)))!important}body[data-fg-step] .fg-button{min-height:max(46px,calc(54 * var(--fg-u)));font-size:max(13px,calc(14 * var(--fg-u)));padding:calc(13 * var(--fg-u)) calc(18 * var(--fg-u));border-radius:calc(13 * var(--fg-u))}body[data-fg-step] .fg-primary{margin-top:calc(14 * var(--fg-u))}body[data-fg-step] .fg-secondary{min-height:max(42px,calc(48 * var(--fg-u)))}body[data-fg-step] .fg-small{font-size:max(11px,calc(12 * var(--fg-u)));line-height:1.5;margin-top:calc(10 * var(--fg-u))}body[data-fg-step] .fg-email-summary,body[data-fg-step] .fg-account{font-size:max(11px,calc(12 * var(--fg-u)));margin:0 0 calc(14 * var(--fg-u))}body[data-fg-step] .fg-resend{margin-top:calc(16 * var(--fg-u));padding-top:calc(13 * var(--fg-u))}body[data-fg-step] .fg-resend .fg-small{margin:0 0 calc(8 * var(--fg-u))}body[data-fg-step] .fg-notice{margin:0 0 calc(14 * var(--fg-u));padding:calc(10 * var(--fg-u)) calc(12 * var(--fg-u));font-size:max(12px,calc(13 * var(--fg-u)))}body[data-fg-step] .fg-arcade{padding:calc(17 * var(--fg-u));margin:0 0 calc(12 * var(--fg-u));border-radius:calc(17 * var(--fg-u))}body[data-fg-step] .fg-arcade-mark{width:calc(38 * var(--fg-u));height:calc(38 * var(--fg-u));margin-bottom:calc(10 * var(--fg-u));font-size:calc(24 * var(--fg-u))}body[data-fg-step] .fg-arcade h3{font-size:max(17px,calc(20 * var(--fg-u)))}body[data-fg-step] .fg-arcade p{font-size:max(12px,calc(12 * var(--fg-u)))}}@media(min-width:900px) and (max-height:820px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-scene,body[data-fg-step] .fg-arcade-mark{display:none}body[data-fg-step] .fg-card h2{margin-top:10px}}@media(min-width:900px) and (max-height:760px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-tagline{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-header{padding-top:calc(14 * var(--fg-u));padding-bottom:calc(10 * var(--fg-u))}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-main{padding-bottom:calc(20 * var(--fg-u))}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-permission{margin:-4px 0 12px;padding:8px 10px}}@media(min-width:900px) and (max-height:700px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-perks{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-description{margin-bottom:10px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card h2{margin:6px 0 6px}}@media(max-width:899px){body[data-fg-step]:not([data-fg-step="legacy"]){display:flex;flex-direction:column;min-height:100vh;min-height:100svh}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-intro{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-main{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:stretch;width:100%;max-width:520px;margin:0 auto;padding:0 16px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card{width:100%;max-width:none;padding:22px 20px 16px;border-radius:22px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card h2{font-size:25px;margin:12px 0 8px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-description{font-size:14px;line-height:1.5;margin:0 0 16px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card input{min-height:50px;padding:12px 14px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-button{min-height:50px;padding:12px 16px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-primary{margin-top:12px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-small{margin-top:10px;line-height:1.5}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-email-summary,body[data-fg-step]:not([data-fg-step="legacy"]) .fg-account{margin:0 0 14px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-resend{margin-top:14px;padding-top:12px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-notice{margin:0 0 12px;padding:10px 12px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-footer{padding:10px 16px 14px}body[data-fg-step]:not([data-fg-step="legacy"]){height:100vh;height:100svh}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-main{min-height:0}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card{max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-arcade-mark{display:none}body[data-fg-step="legacy"]{display:flex;flex-direction:column;min-height:100vh;min-height:100svh}body[data-fg-step="legacy"] .fg-main{flex:1;justify-content:center;margin-top:0;margin-bottom:0}body[data-fg-step="legacy"] .fg-perks,body[data-fg-step="legacy"] .fg-coming-soon{display:none}body[data-fg-step="legacy"] .fg-footer{padding:10px 16px 14px}}@media(max-width:899px) and (max-height:700px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card-top{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-arcade p{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-arcade{padding:12px 14px;margin-bottom:10px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-permission{margin:-4px 0 10px;padding:7px 10px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-resend{margin-top:10px;padding-top:10px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-email-summary,body[data-fg-step]:not([data-fg-step="legacy"]) .fg-account{margin-bottom:10px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-small{font-size:11px;margin-top:8px}body[data-fg-step="legacy"] .fg-header{padding:12px 16px}body[data-fg-step="legacy"] .fg-eyebrow{margin-bottom:8px}body[data-fg-step="legacy"] .fg-intro h1{font-size:28px;margin-bottom:8px}body[data-fg-step="legacy"] .fg-lead{margin-bottom:14px}body[data-fg-step="legacy"] .fg-tagline{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-header{padding:12px 16px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-brand svg{width:36px;height:36px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card{padding:18px 16px 12px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card h2{font-size:22px;margin:8px 0 6px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-description{margin-bottom:12px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-tagline{display:none}}
@media(max-width:899px) and (max-height:450px){body[data-fg-step]{height:100vh;height:100svh;overflow:hidden}body[data-fg-step] .fg-main{min-height:0}body[data-fg-step] .fg-card{max-height:100%;overflow-y:auto;overscroll-behavior:contain}body[data-fg-step="legacy"] .fg-description{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-header{display:none}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-main{padding:8px 16px}body[data-fg-step="legacy"] .fg-intro{display:none}body[data-fg-step="legacy"] .fg-header{padding:8px 16px}body[data-fg-step="legacy"] .fg-card{padding:16px 18px 10px}body[data-fg-step="legacy"] .fg-card h2{font-size:21px;margin:6px 0}body[data-fg-step="legacy"] .fg-family-help{display:none}}
.fg-header-actions{display:flex;align-items:center;gap:10px}.fg-story-open{min-height:44px;padding:10px 4px;border:0;background:none;color:#a9bddb;font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#a9bddb66}.fg-story-open:hover{color:#e6eeff}.fg-story{width:min(640px,calc(100vw - 24px));max-height:calc(100vh - 24px);max-height:calc(100svh - 24px);padding:0;border:1px solid #62759655;border-top:3px solid var(--fg-gold);border-radius:24px;background:linear-gradient(150deg,#15213a,#0d1429);color:var(--fg-ink);box-shadow:0 30px 90px #000a;overflow:hidden}.fg-story::backdrop{background:#03050ecc;backdrop-filter:blur(4px)}.fg-story[open]{animation:fg-arrive .3s ease both}.fg-story-inner{max-height:inherit;overflow-y:auto;overscroll-behavior:contain;padding:30px 32px 26px}.fg-story h2{font-size:28px;line-height:1.2;letter-spacing:-.02em;margin:10px 0 14px}.fg-story h3{font-size:17px;margin:22px 0 10px;color:#ffe6a8}.fg-story p,.fg-story li{font-size:15px;line-height:1.6;color:#c9d5ea}.fg-story p{margin:0 0 12px}.fg-story b{color:#f0f3ff}.fg-story-steps,.fg-story-plan{margin:0 0 12px;padding-left:22px}.fg-story-steps li,.fg-story-plan li{margin:0 0 7px}.fg-story-note{padding:10px 12px;border-left:2px solid #74cedc;background:#17324944;border-radius:0 8px 8px 0}.fg-story-close{margin-top:18px}.fg-story .fg-story-support{margin-top:18px;padding-top:14px;border-top:1px solid #8aa2ca24;font-size:13px;color:#93a6c6}.fg-story-support a{color:#c9d8ef;text-underline-offset:3px}.fg-story-tip{font-size:14px!important;color:#aebfd9!important}.fg-story-why{margin:8px 0 2px}.fg-story-why summary{display:inline-flex;align-items:center;min-height:40px;cursor:pointer;color:#8be9ff;font-weight:700;text-decoration:underline;text-underline-offset:3px;list-style:none}.fg-story-why summary::-webkit-details-marker{display:none}.fg-story-why summary::after{content:"＋";margin-left:8px;text-decoration:none;font-size:.9em}.fg-story-why[open] summary::after{content:"－"}.fg-story-why p{margin:6px 0 4px;padding:10px 12px;border-radius:10px;background:#10233b}.fg-story h2:focus{outline:none}@media(max-width:760px){.fg-header-actions{gap:4px}.fg-story-open{font-size:12px;padding:8px 2px}.fg-story-inner{padding:22px 18px 18px}.fg-story h2{font-size:23px}.fg-story p,.fg-story li{font-size:14px}}@media(max-width:370px){.fg-story-open{font-size:11px}}@media(min-width:2400px){.fg-story{width:1100px;border-radius:40px}.fg-story-inner{padding:56px 60px 48px}.fg-story h2{font-size:52px}.fg-story h3{font-size:30px}.fg-story p,.fg-story li{font-size:26px}.fg-story-open{font-size:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.fg-button:active:not(:disabled){transform:none}}

/* Paid sign-up (design preview only until billing is built). The whole card becomes an
   arcade screen: scanlines, a chasing marquee, a blinking INSERT COIN and a CREDIT counter.
   The coin spins into the button, CREDIT ticks to 1, then the button opens out into the form. */
.fg-card.is-arcade{position:relative;border:2px solid #34446f;border-top:2px solid #34446f;background:radial-gradient(ellipse at 50% -10%,#24366a 0%,#111a3a 45%,#090d20 100%);box-shadow:0 0 0 5px #0e1430,0 0 0 7px #2c3966,0 0 46px #ffd36e14,0 26px 80px #0008,inset 0 0 70px #000b}
.fg-card.is-arcade::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(0deg,#ffffff08 0 1px,transparent 1px 3px)}
.fg-card.is-arcade::after{content:'';position:absolute;left:22px;right:22px;top:9px;height:6px;z-index:0;pointer-events:none;background:radial-gradient(circle,#ffd36e 0 1.6px,#ffd36e44 2.2px,transparent 3px) 0 50%/14px 6px repeat-x;opacity:.85;animation:fg-marquee .9s steps(1) infinite}
.fg-card.is-arcade>*{position:relative;z-index:1}
.fg-card.is-arcade .fg-card-top{font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;margin-top:6px}
.fg-card.is-arcade .fg-kicker{color:#ff7ac8;letter-spacing:.24em;text-shadow:0 0 10px #ff7ac877}
.fg-card.is-arcade .fg-kicker.is-blink{animation:fg-blink 1.1s steps(1) infinite}
.fg-card.is-arcade .fg-step{display:inline-block;color:var(--fg-cyan);font-weight:800;letter-spacing:.14em;text-shadow:0 0 10px #4ce5ff88}
.fg-card.is-arcade h2{color:#fff4cc;text-shadow:0 0 22px #ffd36e40}
.fg-card.is-arcade.is-credit{animation:fg-credit .5s ease-out}
.fg-card.is-arcade.is-credit .fg-step{color:var(--fg-gold);text-shadow:0 0 14px #ffd36e;animation:fg-tick .3s cubic-bezier(.2,1.6,.4,1)}
.fg-coin{--c:1px;margin-top:calc(20 * var(--c));text-align:center}
@media(min-width:900px){body[data-fg-step] .fg-coin{--c:max(.85px,var(--fg-u))}}
#fg-email-panel.is-coin #fg-email-form,#fg-email-panel.is-coin>.fg-small{display:none}
.fg-coin-button{display:flex;align-items:center;justify-content:center;gap:calc(12 * var(--c));width:100%;min-height:calc(56 * var(--c));padding:calc(10 * var(--c)) calc(18 * var(--c));border:0;border-radius:calc(14 * var(--c));background:linear-gradient(180deg,#ffe896 0%,#ffd36e 50%,#f4b53b 100%);color:#1b1f33;box-shadow:0 calc(4 * var(--c)) 0 #b07a22,0 0 calc(24 * var(--c)) #ffd36e38,inset 0 2px 0 #fff7d2;transition:transform .12s ease,box-shadow .12s ease,filter .18s}
.fg-coin-button:hover:not(:disabled){filter:brightness(1.06);box-shadow:0 calc(4 * var(--c)) 0 #b07a22,0 0 calc(34 * var(--c)) #ffd36e5c,inset 0 2px 0 #fff7d2}
.fg-coin-button:active:not(:disabled),.fg-coin.is-dropping .fg-coin-button{transform:translateY(calc(4 * var(--c)));box-shadow:0 0 0 #b07a22,0 0 calc(16 * var(--c)) #ffd36e30,inset 0 2px 0 #fff7d2}
.fg-coin.is-dropping .fg-coin-button{transition-delay:.22s}
.fg-coin-button:focus-visible{outline:3px solid #fff3c4;outline-offset:4px}
.fg-coin-disc{flex:none;display:grid;place-items:center;width:calc(26 * var(--c));height:calc(26 * var(--c));border-radius:50%;border:2px solid #a86d0b;background:radial-gradient(circle at 35% 30%,#fff5c8,#ffd04f 46%,#c98b16 100%);color:#8a5a06;font-size:calc(12 * var(--c));box-shadow:0 1px 3px #0005;animation:fg-coin-idle 3.2s ease-in-out infinite}
.fg-coin.is-dropping .fg-coin-disc{animation:fg-coin-in .5s cubic-bezier(.5,0,.75,1) both}
.fg-coin-face{display:flex;align-items:center;min-width:0;text-transform:uppercase;white-space:nowrap}
.fg-coin-face small{font-size:max(10px,calc(11 * var(--c)));font-weight:900;letter-spacing:.2em;color:#7a520f}
.fg-coin-face b{margin-left:calc(11 * var(--c));padding-left:calc(11 * var(--c));border-left:2px solid #c8902a66;font-size:max(15px,calc(18 * var(--c)));font-weight:900;letter-spacing:.05em}
/* Narrow phones: COIN IN sits above the price so the button stays one compact height. */
@media(max-width:420px){.fg-coin-button{justify-content:flex-start;padding-left:16px}.fg-coin-face{flex-direction:column;align-items:flex-start;line-height:1.15}.fg-coin-face b{margin:2px 0 0;padding:0;border:0;font-size:17px}}
/* The arcade's top line (INSERT COIN / CREDIT) stays even where short screens drop the card header. */
body[data-fg-step] .fg-card.is-arcade .fg-card-top{display:flex}
.fg-coin-note{margin:calc(14 * var(--c)) 0 0;color:var(--fg-muted)}
.fg-coin-family{margin-top:calc(16 * var(--c))}
.fg-coin-signin{display:block;margin:calc(6 * var(--c)) auto 0;min-height:44px}
#fg-email-form.is-morphing{position:relative}
#fg-email-form.is-morphing>*{animation:fg-arrive .36s .14s ease both}
#fg-email-form.is-morphing::after{content:'';position:absolute;inset:0;border-radius:14px;background:linear-gradient(180deg,#ffe896,#f4b53b);pointer-events:none;animation:fg-morph-glow .48s ease-out forwards}
.fg-pay-ok{display:flex;align-items:center;gap:10px;margin-top:4px;padding:12px 14px;border:1px solid #4fd1a055;border-radius:13px;background:#12382f55;color:#c8f5e3;font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.fg-pay-tick{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#4fd1a0;color:#0b1a1a;font-weight:900;animation:fg-tick .42s cubic-bezier(.2,1.4,.4,1) both}
.fg-pay-going{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px;color:var(--fg-muted);font-size:13px}
.fg-pay-going[hidden]{display:none}
.fg-pay-wallet{margin:12px 0 0;min-height:48px;border-radius:12px;overflow:hidden;animation:fg-pop .28s cubic-bezier(.2,.8,.2,1) both}
.fg-pay-wallet[hidden]{display:none}
.fg-pay-dialog{width:min(420px,calc(100vw - 32px));padding:0;border:2px solid #34446f;border-radius:24px;background:radial-gradient(ellipse at 50% -10%,#24366a 0%,#111a3a 50%,#090d20 100%);color:var(--fg-ink);box-shadow:0 0 0 5px #0e1430,0 0 0 7px #2c3966,0 30px 90px #000a}
.fg-pay-dialog[open]{animation:fg-pop .28s cubic-bezier(.2,.8,.2,1) both}
.fg-pay-dialog::backdrop{background:#03050ecc;backdrop-filter:blur(4px)}
.fg-pay-dialog-inner{padding:26px 24px 16px;background:repeating-linear-gradient(0deg,#ffffff07 0 1px,transparent 1px 3px)}
.fg-pay-dialog .fg-kicker{color:#ff7ac8;font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.24em;text-shadow:0 0 10px #ff7ac877}
.fg-pay-dialog h2{margin:8px 0 18px;font-size:24px;line-height:1.25;color:#fff4cc;text-shadow:0 0 22px #ffd36e40}
.fg-pay-dialog h2:focus{outline:none}
.fg-pay-options{display:grid;gap:10px}
.fg-pay-option{display:flex;align-items:center;width:100%;min-height:56px;padding:0 18px;border:1px solid #6f87ab66;border-radius:14px;background:#1b2a47;color:var(--fg-ink);font-size:15px;font-weight:800;text-align:left;transition:border-color .16s,background .16s,transform .16s}
.fg-pay-option::after{content:'→';margin-left:auto;color:var(--fg-gold)}
.fg-pay-option:hover:not(:disabled){border-color:var(--fg-gold);background:#233658;transform:translateY(-1px)}
.fg-pay-option:focus-visible{outline:2px solid var(--fg-gold);outline-offset:2px}
#fg-pay-cancel{display:block;margin:12px auto 0;min-height:44px}
@keyframes fg-marquee{0%{background-position:0 50%}50%{background-position:7px 50%}}
@keyframes fg-blink{0%{opacity:1}50%{opacity:.25}}
@keyframes fg-coin-idle{0%,80%,100%{transform:rotateY(0)}90%{transform:rotateY(180deg)}}
@keyframes fg-coin-in{0%{transform:rotateY(0) scale(1);opacity:1}60%{transform:rotateY(540deg) translateY(-6px) scale(1.15);opacity:1}100%{transform:rotateY(900deg) translateY(4px) scale(.2);opacity:0}}
@keyframes fg-credit{0%{box-shadow:0 0 0 5px #0e1430,0 0 0 7px #2c3966,0 0 46px #ffd36e14,0 26px 80px #0008,inset 0 0 70px #000b}30%{box-shadow:0 0 0 5px #0e1430,0 0 0 7px #ffd36e,0 0 70px #ffd36e55,0 26px 80px #0008,inset 0 0 70px #000b}}
@keyframes fg-morph-glow{0%,22%{opacity:1}100%{opacity:0}}
@keyframes fg-tick{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes fg-pop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.fg-card.is-arcade::after,.fg-card.is-arcade .fg-kicker.is-blink,.fg-coin-disc,.fg-pay-tick,.fg-pay-dialog[open],.fg-card.is-arcade.is-credit,.fg-card.is-arcade.is-credit .fg-step{animation:none}}
/* Promo offer ribbon (front-gate-offers.js): a neon strip under the card's top line. */
.fg-offer{display:flex;align-items:center;gap:12px;margin:14px 0 -4px;padding:10px 14px;border:1px solid #ff7ac866;border-radius:14px;background:linear-gradient(100deg,#3a103066,#1a1f4a66);box-shadow:0 0 22px #ff7ac81f;animation:fg-arrive .35s ease both}
.fg-offer-tag{flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--fg-gold);color:#142036;font-size:15px;box-shadow:0 0 14px #ffd36e88}
.fg-offer-words{min-width:0}
.fg-offer b{display:block;font:800 12px/1.4 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.14em;color:#ffb3e6;text-shadow:0 0 10px #ff7ac866}
.fg-offer small{display:block;margin-top:2px;font-size:12px;line-height:1.45;color:#c9cff0}
.fg-offer-ask{display:flex;align-items:center;gap:12px;margin-top:8px}.fg-offer-ask[hidden]{display:none}.fg-offer-ask .fg-button{margin:0;min-height:0;padding:8px 14px;font-size:13px}
.fg-offer small:empty{display:none}
.fg-offer .fg-offer-note{margin-top:6px;font-style:italic;color:#ece4ff;opacity:.94}.fg-offer .fg-offer-note[hidden]{display:none}
.fg-offer-note-short{display:none}@media(max-width:899px) and (max-height:700px){.fg-offer.has-note{margin-top:4px;padding:7px 12px}.fg-offer.has-note b{line-height:1.3}.fg-offer.has-note .fg-offer-tag{display:none}.fg-offer.has-note small{font-size:12px;line-height:1.4}.fg-offer.has-note .fg-offer-note{margin-top:4px}}@media(max-height:599px){.fg-offer-note-full{display:none}.fg-offer-note-short{display:inline}}
/* After Coin in on a phone or a laptop-height screen the offer was already read: its ribbon keeps only the title, so the email box, the quick check and
   Send fit under it (the tall Turnstile box pushed Send below the fold at 375x812 with any offer). */
@media(max-height:860px){body[data-fg-step="email"] .fg-card:has(#fg-email-panel:not(.is-coin)) .fg-offer small{display:none}body[data-fg-step="email"] .fg-card:has(#fg-email-panel:not(.is-coin)) .fg-offer{margin-top:8px;padding:6px 12px}body[data-fg-step="email"] .fg-card:has(#fg-email-panel:not(.is-coin)) .fg-offer-tag{width:22px;height:22px;font-size:12px}}
.fg-offer.is-muted{border-color:#8f98c944;background:#1a1f3a66;box-shadow:none}
.fg-offer.is-muted b{color:#a9b2d8;text-shadow:none}
.fg-offer.is-muted .fg-offer-tag{background:#3a4470;color:#a9b2d8;box-shadow:none}
@media(min-width:2400px){.fg-offer{padding:18px 24px;gap:20px}.fg-offer-tag{width:52px;height:52px;font-size:26px}.fg-offer b{font-size:21px}.fg-offer small{font-size:20px}}
@media(prefers-reduced-motion:reduce){.fg-offer{animation:none}}
/* Bring a friend: the owner's referral link (front-gate-offers.js). */
.fg-refer{margin:0 0 15px;padding:16px 17px;border:1px solid #ffd36e55;border-radius:17px;background:linear-gradient(140deg,#2a241866,#10233b);box-shadow:0 0 24px #ffd36e14}
.fg-refer h3{margin:0 0 6px;font-size:16px;color:#fff4cc}
.fg-refer h3 span{color:var(--fg-gold);margin-right:4px}
.fg-refer p{margin:0;font-size:13px;line-height:1.55;color:#c9d6ec}
.fg-refer .fg-small{margin-top:8px}
/* Referral boost (W2.2): the gold "BOOST · until 16 Nov" tag above a member's terms, in the card and the Invite dialog. */
.fg-boost-tag,.fg-refer .fg-boost-tag{display:inline-block;max-width:100%;margin:2px 0 8px;padding:4px 10px;border:1px solid #ffd36e88;border-radius:999px;background:#3a2e1099;color:var(--fg-gold);font:800 11px/1.4 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.12em;overflow-wrap:anywhere;box-shadow:0 0 12px #ffd36e33}
.fg-boost-tag[hidden]{display:none}
.fg-refer .fg-small:empty{display:none}
.fg-refer-link{display:flex;gap:8px;margin-top:11px}
.fg-refer-link input{flex:1;min-width:0;min-height:44px!important;padding:9px 11px!important;font:12px ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace!important;color:#cfe8ff!important}
.fg-refer-link .fg-button{width:auto;min-height:44px;flex:none}
@media(min-width:2400px){.fg-refer{padding:28px 30px}.fg-refer h3{font-size:28px}.fg-refer p{font-size:22px}.fg-refer-link input{font-size:20px!important;min-height:70px!important}.fg-refer-link .fg-button{min-height:70px}}
/* Invite friends: the member's one link, its QR, and a plain fullscreen view to scan in person. */
.fg-refer-ladder{margin:9px 0 0!important;padding:8px 11px;border-radius:10px;background:#0e2a3a88;color:#cdefff!important;font:700 12px/1.5 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace!important;letter-spacing:.02em}
.fg-refer-invite{margin-top:12px}
.fg-invite{width:min(420px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid #ffd36e66;border-radius:24px;background:linear-gradient(160deg,#18205a,#0d1233);color:var(--fg-ink);box-shadow:0 30px 90px #000a}
.fg-invite::backdrop{background:#03040ccc}
.fg-invite-inner{display:flex;flex-direction:column;gap:10px;padding:20px 20px 14px;text-align:center}
.fg-invite h2{margin:0;font-size:24px}
.fg-invite h2:focus{outline:none}
.fg-invite-terms{margin:0;font-size:13px;line-height:1.55;color:#c9d6ec}
.fg-invite-qr{align-self:center;padding:10px;border-radius:16px;background:#fff;box-shadow:0 0 0 3px #ffd36e,0 0 30px #ffd36e44}
.fg-invite-qr canvas{display:block;width:min(200px,46vw,32dvh);height:auto;image-rendering:pixelated}
.fg-invite-actions{display:flex;gap:8px}
.fg-invite-actions .fg-button{margin:0;flex:1;padding-left:10px;padding-right:10px;white-space:nowrap}
.fg-invite .fg-text-button{align-self:center}
.fg-scan{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px;background:#fff;color:#000;cursor:pointer;touch-action:manipulation}
.fg-scan[hidden]{display:none!important}
.fg-scan canvas{display:block;width:min(86vw,calc(100dvh - 120px));height:auto;max-width:640px;image-rendering:pixelated}
.fg-scan-link{margin:0;font:800 clamp(16px,4.6vw,30px)/1.2 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.04em;text-align:center;word-break:break-all}
.fg-scan-hint{margin:0;font-size:12px;color:#555}
@media(orientation:landscape) and (max-height:500px){.fg-scan{flex-direction:row;gap:20px}.fg-scan canvas{width:min(calc(100dvh - 32px),55vw)}.fg-scan-link{max-width:36vw;text-align:left}.fg-scan-hint{display:none}}
@media(max-height:620px){.fg-invite-inner{gap:7px;padding:14px 16px 10px}.fg-invite h2{font-size:20px}.fg-invite .fg-kicker{display:none}}
/* Landscape phones: the QR beside the rest, so the invite fits without scrolling. */
@media(orientation:landscape) and (max-height:500px){.fg-invite{width:min(660px,calc(100vw - 24px));max-height:calc(100dvh - 12px)}.fg-invite-inner{display:grid;grid-template-columns:auto 1fr;column-gap:18px;row-gap:5px;align-items:center;text-align:left}.fg-invite-inner>*{grid-column:2}.fg-invite-inner>.fg-invite-qr{grid-column:1;grid-row:1/span 7}.fg-invite-qr canvas{width:min(170px,calc(100dvh - 90px))}.fg-invite-terms{font-size:12px;line-height:1.4}.fg-invite .fg-refer-ladder{margin:0!important;padding:5px 10px}.fg-invite-inner{position:relative;padding:12px 16px}.fg-invite .fg-text-button{position:absolute;top:12px;right:16px;margin:0}.fg-invite h2{padding-right:60px}.fg-invite-actions .fg-button,.fg-invite .fg-refer-link .fg-button{min-height:0;padding-top:10px;padding-bottom:10px}}

/* The small print: quiet Terms and Privacy links in the page footer, beside the tagline. Short
   screens drop the tagline first; the links stay wherever the card leaves room. */
.fg-legal{display:flex;justify-content:center;align-items:center;gap:2px;font-size:11px;letter-spacing:.04em}
.fg-legal a{display:inline-flex;align-items:center;min-height:32px;padding:0 9px;color:#7f93b5;text-decoration:none;border-radius:8px}
.fg-legal a:hover{color:#dfe8fb;text-decoration:underline;text-underline-offset:3px}
.fg-legal a:focus-visible,.fg-consent a:focus-visible,.fg-story-legal a:focus-visible{outline:2px solid var(--fg-gold);outline-offset:2px}
.fg-legal span{color:#4d5f80}
.fg-consent{margin-top:10px!important;color:#9fb3d1}
.fg-consent a{color:#c9d8ef;text-underline-offset:3px}
.fg-story .fg-story-legal{margin-top:6px;font-size:13px;color:#93a6c6}
.fg-story-legal a{color:#c9d8ef;text-underline-offset:3px}
@media(min-width:900px){body[data-fg-step] .fg-legal{font-size:max(11px,calc(11 * var(--fg-u)))}body[data-fg-step] .fg-legal a{min-height:max(32px,calc(36 * var(--fg-u)))}}

@media(min-width:2400px){.fg-legal{font-size:20px}.fg-legal a{min-height:60px;padding:0 16px}.fg-story .fg-story-legal{font-size:24px}}
/* Short landscape phones have no room to spare once signing in: the small print stays on the welcome
   step, and the pay step's consent line beside the button links both. */
@media(max-width:899px) and (max-height:450px){.fg-legal a{min-height:30px}body[data-fg-step]:not([data-fg-step="legacy"]):not([data-fg-step="email"]) .fg-footer{display:none}}
/* The pay step's consent line already links both pages; on phones, the signed-in steps keep the card short. */
body[data-fg-step="pay"] .fg-legal{display:none}
@media(max-width:899px) and (max-height:860px){body[data-fg-step="code"] .fg-footer,body[data-fg-step="arcades"] .fg-footer,body[data-fg-step="locked"] .fg-footer,body[data-fg-step="pay"] .fg-footer{display:none}}

.fg-locked-manage{margin-top:4px}

/* Design pass (2 Nov 2026): one calm hierarchy on every window. Kicker, title, one supporting line,
   the main action with its price right under it, then a single row of quiet secondary ways in.
   Help text shares one size and colour, text buttons are never underlined, and the small print
   lives in the page footer. Sizes scale with --fg-u from 900px up, so a TV across the room and a
   360px phone both read comfortably. */
:root{--fg-help:#a7b7d2;--fg-link:#9fe6f7;--fg-line:#8aa2ca26}
/* Header: About and Demo are quiet words beside the party pill. */
.fg-header-actions{gap:4px}
.fg-story-open,.fg-nav-demo{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px;border:0;border-radius:999px;background:none;color:#b8c7e0;font-size:14px;font-weight:700;text-decoration:none;transition:color .18s,background .18s}
.fg-story-open:hover,.fg-nav-demo:hover{color:#f0f3ff;background:#ffffff0f}
.fg-join-top{margin-left:6px}
@media(max-width:899px){.fg-nav-demo{display:none}}
@media(max-width:760px){.fg-story-open{font-size:13px;padding:8px 10px}.fg-join-top{margin-left:2px}}
.fg-join-top{white-space:nowrap}
@media(max-width:420px){.fg-story-open{padding:8px 6px}.fg-join-top{margin-left:0}}
@media(max-width:370px){.fg-story-open{font-size:12px;padding:8px 6px}}
/* Intro: everything lines up on the left edge of the headline. */
.fg-lead{text-align:left;margin-left:0;max-width:30em}
.fg-scene{margin-left:0}
/* Perks: three even items, an icon tile, a title and one short line. */
.fg-perk-icon{display:grid;place-items:center;width:36px;height:36px;margin:0 0 12px;border:1px solid #8fb4dc33;border-radius:11px;background:#ffffff08;color:var(--fg-gold);font-style:normal;font-size:17px;line-height:1}
.fg-perks li:nth-child(2) .fg-perk-icon{color:var(--fg-cyan)}
.fg-perks li:nth-child(3) .fg-perk-icon{color:#ee8bdf}
.fg-perks b{color:#eef2fd}
.fg-perks span{color:#9fb0cc}
@media(min-width:900px){
 body[data-fg-step] .fg-perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(28 * var(--fg-u));margin-top:calc(10 * var(--fg-u))}
 body[data-fg-step] .fg-perks li,body[data-fg-step] .fg-perks .fg-perk-shared{width:auto;margin:0;padding:0}
 body[data-fg-step] .fg-perk-icon{width:max(30px,calc(38 * var(--fg-u)));height:max(30px,calc(38 * var(--fg-u)));margin-bottom:calc(12 * var(--fg-u));border-radius:calc(11 * var(--fg-u));font-size:max(14px,calc(18 * var(--fg-u)))}
 body[data-fg-step] .fg-perks b{font-size:max(14px,calc(16 * var(--fg-u)));line-height:1.35}
 body[data-fg-step] .fg-perks span{font-size:max(13px,calc(14 * var(--fg-u)));line-height:1.5;margin-top:calc(4 * var(--fg-u))}
 body[data-fg-step] .fg-lead{margin:0;max-width:calc(560 * var(--fg-u))}
 body[data-fg-step] .fg-scene{margin-left:0}
 body[data-fg-step] .fg-coin-note{font-size:max(13.5px,calc(15 * var(--fg-u)))}
}
/* Narrower desktops: the perks stack, icon beside the words. */
@media(min-width:900px) and (max-width:1180px){
 body[data-fg-step] .fg-perks{grid-template-columns:minmax(0,1fr);gap:calc(14 * var(--fg-u))}
 body[data-fg-step] .fg-perks li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:calc(14 * var(--fg-u))}
 body[data-fg-step] .fg-perk-icon{grid-row:1/span 2;margin:0}
}
/* Card type: one help size and colour, labels a step up, no underlines on buttons. */
.fg-description{color:#b5c3dc}
.fg-small,.fg-check p{color:var(--fg-help)}
.fg-label{color:#e3eaf7}
.fg-text-button{color:var(--fg-link);font-weight:700;text-decoration:none;border-radius:8px;padding:8px 10px;transition:color .16s,background .16s}
.fg-text-button:hover:not(:disabled){color:#fff;background:#ffffff0f}
.fg-text-button:disabled{opacity:.5;cursor:default}
.fg-check button{color:var(--fg-link);text-decoration:none;font-weight:700}
@media(min-width:900px){
 body[data-fg-step] .fg-description{font-size:max(15px,calc(16 * var(--fg-u)))}
 body[data-fg-step] .fg-small,body[data-fg-step] .fg-check p{font-size:max(12.5px,calc(13 * var(--fg-u)))}
 body[data-fg-step] .fg-label{font-size:max(13px,calc(14 * var(--fg-u)))}
 body[data-fg-step] .fg-button{font-size:max(14px,calc(15 * var(--fg-u)))}
 body[data-fg-step] .fg-text-button{font-size:max(13px,calc(14 * var(--fg-u)));min-height:max(40px,calc(44 * var(--fg-u)))}
}
@media(max-width:899px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-small{font-size:12.5px}.fg-text-button{font-size:13px}}
/* The price under the coin: one readable line, not small print. */
.fg-coin-note{margin:calc(12 * var(--c,1px)) 0 0;font-size:max(13.5px,calc(14 * var(--c,1px)));line-height:1.45;color:#cdd8ec;text-align:center;text-wrap:balance}
.fg-coin-note:empty{display:none}
.fg-coin-family{margin-top:calc(14 * var(--c))}
/* The card's foot: the secondary ways in, as one even row. */
.fg-card-foot{display:flex;gap:10px;margin-top:22px;padding-top:16px;border-top:1px solid var(--fg-line)}
.fg-foot-link{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 14px;border:1px solid #61799866;border-radius:12px;background:#ffffff06;color:#d6e1f3;font-size:14px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color .18s,background .18s,color .18s}
.fg-foot-link:hover:not(:disabled){border-color:#8fd0e6aa;background:#ffffff10;color:#fff}
.fg-foot-link:disabled{opacity:.5;cursor:default}
.fg-foot-link span{color:var(--fg-link)}
@media(min-width:900px){
 body[data-fg-step] .fg-card-foot{gap:calc(10 * var(--fg-u));margin-top:calc(20 * var(--fg-u));padding-top:calc(16 * var(--fg-u))}
 body[data-fg-step] .fg-foot-link{min-height:max(42px,calc(48 * var(--fg-u)));padding:calc(10 * var(--fg-u)) calc(16 * var(--fg-u));border-radius:calc(12 * var(--fg-u));font-size:max(13px,calc(15 * var(--fg-u)))}
}
@media(max-width:899px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card-foot{margin-top:16px;padding-top:14px}}
@media(max-width:400px){.fg-card-foot{gap:8px}.fg-foot-link{font-size:13px;padding:10px}}
/* Paying, or sorting out a paused arcade, is no time for a side door: the header keeps Join a party. */
body[data-fg-step="pay"] .fg-card-foot,body[data-fg-step="locked"] .fg-card-foot,body[data-fg-step="phone"] .fg-card-foot{display:none}
@media(max-width:899px) and (max-height:860px){body[data-fg-step="code"] .fg-card-foot,body[data-fg-step="arcades"] .fg-card-foot{display:none}}
@media(max-width:899px) and (max-height:700px){body[data-fg-step="email"] #fg-email-panel:not(.is-coin)~.fg-card-foot{display:none}}
@media(min-width:2400px){.fg-foot-link{font-size:24px;min-height:80px;border-radius:20px}.fg-coin-note{font-size:24px}}
/* Chips: who the code went to, who is signed in, what was confirmed. One shape for all three. */
.fg-email-summary,.fg-account{gap:10px;padding:6px 6px 6px 14px;border:1px solid #6d86ad40;border-radius:12px;background:#0b142a99;color:#d3def1}
.fg-email-summary span,.fg-account span{padding-right:0}
#fg-sent-email,#fg-alias-sent-email,#fg-account-email{flex:1}
.fg-chip-icon{flex:none;color:var(--fg-link)}
.fg-email-summary .fg-text-button,.fg-account .fg-text-button{min-height:40px}
.fg-pay-ok{border-radius:12px}
@media(min-width:900px){body[data-fg-step] .fg-email-summary,body[data-fg-step] .fg-account{font-size:max(12.5px,calc(13 * var(--fg-u)))}}
/* Code step: the resend help shows only when it has something to add, and the resend sits close to
   Sign in without a second rule line above the card's foot. */
.fg-resend .fg-small:empty{display:none}
.fg-resend,body[data-fg-step] .fg-resend{border-top:0;padding-top:0}
@media(max-width:420px){.fg-email-summary .fg-chip-icon{display:none}}
/* Pay step: the checkout line above the button, the consent line straight under it. */
.fg-pay-note{margin:14px 0 0;font-size:13px;line-height:1.5;color:var(--fg-help)}
.fg-pay-note:empty{display:none}
/* Stripe reassurance under the pay button (Alfie, 9 Nov 2026): visible, quiet, one or two short lines. */
.fg-secure{display:flex;align-items:flex-start;justify-content:center;gap:7px;margin:12px auto 0;max-width:34em;font-size:12px;line-height:1.45;color:var(--fg-help);text-align:left;text-wrap:pretty}.fg-secure[hidden]{display:none}.fg-secure b{color:inherit;font-weight:700}.fg-lock{flex:none;width:12px;height:12px;margin-top:2px;opacity:.85}
@media(min-width:900px){body[data-fg-step] .fg-secure{font-size:max(11.5px,calc(12 * var(--fg-u)));margin-top:calc(12 * var(--fg-u))}}
@media(max-width:899px) and (max-height:450px){.fg-secure{margin-top:6px;font-size:11px}}
.fg-consent{line-height:1.5}
@media(min-width:900px){body[data-fg-step] .fg-pay-note{font-size:max(12.5px,calc(13 * var(--fg-u)));margin-top:calc(14 * var(--fg-u))}}
/* Arcades: the name with Rename beside it, then Open. */
.fg-arcade{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:center}
.fg-arcade-mark{display:none}
.fg-arcade h3{grid-column:1;grid-row:1;margin:0}
.fg-arcade p{grid-column:1/-1;grid-row:2;margin-top:6px}
.fg-arcade .fg-button{grid-column:1/-1;grid-row:3}
.fg-arcade .fg-rename-open{grid-column:2;grid-row:1;margin:0 -6px 0 0;padding:6px 10px;min-height:40px}
/* Locked screens: the price under the coin, one secondary button, then one quiet row. */
#fg-locked-panel .fg-consent{margin-top:12px!important}
#fg-locked-check{margin-top:16px}
.fg-quiet-row{display:flex;justify-content:center;flex-wrap:wrap;gap:2px 14px;margin-top:10px}
.fg-quiet-row .fg-locked-manage{margin-top:0}
@media(max-width:899px) and (max-height:700px){body[data-fg-step]:not([data-fg-step="legacy"]) #fg-locked-check{margin-top:12px}.fg-quiet-row{margin-top:6px}}
/* Offer ribbon and Bring a friend: the same help size as the rest of the card. */
.fg-button span{margin-left:.5em;padding-left:0;font-size:inherit}
.fg-offer-ask .fg-button,body[data-fg-step] .fg-offer-ask .fg-button{width:auto;min-height:40px;margin:0;padding:8px 16px;border-radius:10px;font-size:14px}
.fg-offer small{font-size:13px;color:#cdd4ef}
.fg-offer-ask .fg-text-button{padding:8px 10px}
.fg-refer p{font-size:13px;color:#c3d0e6}
/* Footer: the tagline and the small print on one quiet line. */
.fg-footer{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:0 18px}
.fg-legal{font-size:12px}
.fg-legal a{color:#8ea2c4}
@media(min-width:900px){body[data-fg-step] .fg-footer{padding-top:calc(6 * var(--fg-u));padding-bottom:calc(6 * var(--fg-u))}body[data-fg-step] .fg-legal{font-size:max(12px,calc(12 * var(--fg-u)))}}
@media(max-width:899px){body[data-fg-step] .fg-footer{padding:4px 16px 8px}}
/* About: the disclosure reads as a quiet control, not a link. */
.fg-story-why summary{text-decoration:none}
/* Short landscape phones: the same pieces, packed tighter, so the welcome still fits without scrolling. */
@media(max-width:899px) and (max-height:450px){body[data-fg-step]:not([data-fg-step="legacy"]) .fg-card-foot{margin-top:10px;padding-top:10px}body[data-fg-step] .fg-foot-link{min-height:40px;padding:7px 10px}body[data-fg-step] .fg-footer{padding:0 16px 2px}body[data-fg-step]:not([data-fg-step="legacy"]) .fg-small,.fg-pay-note{font-size:12px;margin-top:8px}.fg-coin-note{margin-top:8px}#fg-locked-check{margin-top:10px}.fg-quiet-row{margin-top:4px}}
/* Pay on your phone: a quiet link under the pay button, then a QR the phone scans. */
.fg-phone-open{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px auto 0;padding:8px 12px}
.fg-phone-icon{width:18px;height:18px;flex:none}
#fg-locked-panel .fg-phone-open{margin-top:6px}
/* A phone in hand already pays on itself: the link is for TVs, laptops and tablets. */
@media(pointer:coarse) and (max-width:899px){#fg-pay-phone,#fg-locked-phone{display:none}}
#fg-phone-panel{text-align:center}
.fg-qr-frame{width:min(232px,34vh);aspect-ratio:1;margin:2px auto 0;padding:10px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px #ffd36e55,0 14px 40px #0006,0 0 46px #4ce5ff22;animation:fg-arrive .35s ease both}
.fg-qr-frame canvas{display:block;width:100%;height:100%;image-rendering:pixelated;border-radius:8px}
.fg-qr-wait{display:flex;align-items:center;justify-content:center;gap:2px;margin:16px 0 4px;font-size:14px;color:#cdd8ec}
.fg-qr-wait .fg-spinner{width:16px;height:16px;margin-right:10px}
#fg-phone-new{margin-top:14px}
@media(min-width:900px){body[data-fg-step="phone"] .fg-qr-frame{width:min(calc(260 * var(--fg-u)),36vh)}body[data-fg-step="phone"] .fg-qr-wait{font-size:max(14px,calc(15 * var(--fg-u)))}}
@media(min-width:2400px){.fg-phone-icon{width:30px;height:30px}.fg-qr-wait{font-size:24px}}
@media(prefers-reduced-motion:reduce){.fg-qr-frame{animation:none}}

/* Wave 9 "First impressions" (front-gate-welcome.js; each piece only while its switch is on, W9.6 always).
   W9.1: under the coin on phones (the hero and the Demo link are hidden there once a step shows), a small looping
   TV-and-phones scene, the game counts and the demo. Fixed timings; the global reduced-motion rule stills it. */
.fg-welcome-strip{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:14px;margin:16px 0 0;padding:12px 14px;border:1px solid var(--fg-line);border-radius:16px;background:linear-gradient(150deg,#ffffff08,#ffffff03);text-align:left;animation:fg-arrive .5s ease both}
.fg-welcome-strip[hidden]{display:none}
.fg-welcome-stage{grid-row:1/span 2;width:92px;line-height:0}
.fg-welcome-art{width:100%;height:auto;overflow:visible}
.fg-welcome-art .fg-w-tv{fill:#0c1430;stroke:#8aa2ca88;stroke-width:1.6}
.fg-welcome-art .fg-w-screen{fill:#14224a}
.fg-welcome-art .fg-w-orbit{fill:none;stroke:#8fb4dc55;stroke-width:.9}
.fg-welcome-art .fg-w-sun{fill:var(--fg-gold);animation:fg-w-glow 3.6s ease-in-out infinite}
.fg-welcome-art .fg-w-planet{fill:var(--fg-cyan);transform-origin:60px 22px;animation:fg-w-orbit 3.6s linear infinite}
.fg-welcome-art .fg-w-stand{fill:none;stroke:#8aa2ca88;stroke-width:1.6;stroke-linecap:round}
.fg-welcome-art .fg-w-phone rect{fill:#0c1430;stroke:#b8c7e0;stroke-width:1.3}
.fg-welcome-art .fg-w-phone circle{fill:#4d5f80}
.fg-welcome-art .fg-w-phone{animation:fg-w-tap 3.6s ease-in-out infinite}
.fg-welcome-art .fg-w-p2{animation-delay:1.2s}.fg-welcome-art .fg-w-p3{animation-delay:2.4s}
.fg-welcome-art .fg-w-p1 circle{fill:#ee8bdf}.fg-welcome-art .fg-w-p2 circle{fill:var(--fg-cyan)}.fg-welcome-art .fg-w-p3 circle{fill:var(--fg-gold)}
.fg-welcome-art .fg-w-signal{fill:var(--fg-cyan);opacity:0;animation:fg-w-send 3.6s ease-in infinite}
.fg-welcome-art .fg-w-s3{fill:var(--fg-gold);animation-delay:2.4s}
@keyframes fg-w-orbit{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes fg-w-glow{0%,100%{opacity:.85}50%{opacity:1}}
@keyframes fg-w-tap{0%,22%,100%{transform:translateY(0)}8%{transform:translateY(-3px)}}
@keyframes fg-w-send{0%{opacity:0;transform:translate(0,0)}6%{opacity:1}26%{opacity:0;transform:translate(var(--fg-w-dx,18px),-16px)}100%{opacity:0}}
.fg-welcome-art .fg-w-s3{--fg-w-dx:-18px}
.fg-welcome-count{margin:0;font-size:14px;line-height:1.4;color:#cdd8ec}
.fg-welcome-count b{color:#f0f3ff}
.fg-welcome-demo{display:inline-flex;align-items:center;gap:6px;min-height:40px;color:var(--fg-link);font-size:14px;font-weight:700;text-decoration:none}
.fg-welcome-demo:hover{text-decoration:underline;text-underline-offset:3px}
.fg-welcome-demo:focus-visible{outline:2px solid var(--fg-gold);outline-offset:2px;border-radius:6px}
@media(min-width:900px){.fg-welcome-strip{display:none}}
@media(max-height:450px){.fg-welcome-stage{display:none}.fg-welcome-strip{grid-template-columns:minmax(0,1fr);margin-top:10px;padding:8px 12px}}
/* W9.3: the card line before the coin, and the first monthly payment's date on the pay step. */
.fg-coin-card{margin:6px 0 0;font-size:max(12.5px,calc(13 * var(--c,1px)));line-height:1.45;color:var(--fg-help);text-align:center;text-wrap:balance}
.fg-pay-first{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--fg-help)}
@media(min-width:900px){body[data-fg-step] .fg-coin-card{font-size:max(12.5px,calc(13.5 * var(--fg-u)))}body[data-fg-step] .fg-pay-first{font-size:max(12.5px,calc(13.5 * var(--fg-u)))}}
/* W9.5: Help sits first in the footer's small print and opens a reading panel like About. */
.fg-legal .fg-help-open{align-items:center;min-height:32px;padding:0 9px;border:0;border-radius:8px;background:none;color:#7f93b5;font:inherit;letter-spacing:inherit;cursor:pointer}
.fg-legal .fg-help-open:hover{color:#dfe8fb;text-decoration:underline;text-underline-offset:3px}
.fg-legal .fg-help-open:focus-visible{outline:2px solid var(--fg-gold);outline-offset:2px}
.fg-legal .fg-help-open:not([hidden]){display:inline-flex}
@media(min-width:900px){body[data-fg-step] .fg-legal .fg-help-open{min-height:max(32px,calc(36 * var(--fg-u)))}}
@media(min-width:2400px){.fg-legal .fg-help-open{min-height:60px;padding:0 16px}}
.fg-help .fg-help-item{margin:4px 0;display:block}
.fg-help .fg-help-item p{margin:6px 0 8px}
.fg-help .fg-help-test{display:inline-flex;margin:2px 0 10px;min-height:44px;text-decoration:none}
.fg-help .fg-help-ask{margin-top:18px;padding-top:14px;border-top:1px solid #8aa2ca24;font-size:14px}
.fg-help .fg-help-ask a{color:#c9d8ef;text-underline-offset:3px}
/* W9.6: just signed up on a phone, so the TV is next. */
.fg-tv-next{margin:0 0 16px;padding:14px 16px 4px;border:1px solid #4ce5ff44;border-radius:16px;background:#4ce5ff0d;text-align:left;animation:fg-arrive .4s ease both}
.fg-tv-next h3{margin:0 0 8px;font-size:17px;line-height:1.3;color:#f0f3ff}
.fg-tv-next .fg-story-steps{margin:0 0 8px;padding-left:20px}
.fg-tv-next li{margin:0 0 6px;font-size:14px;line-height:1.5;color:#c9d5ea}
.fg-tv-next li b{color:#f0f3ff}
.fg-tv-next .fg-small{margin:0 0 10px}
/* Card scans (9 Nov 2026): the offer ribbon title never leaves "1" alone on its last line. */
.fg-offer b{text-wrap:pretty}
/* The game reel after "Coin in" (front-gate-reel.js, 9 Nov 2026): real moments from the recommended games, story-style
   bars on top, the game's name and one line at the bottom. Slim when the card is short; hidden rather than scrolling. */
.fg-reel{display:block;position:relative;width:100%;aspect-ratio:12/5;margin:0 0 16px;padding:0;border:1px solid #62759666;border-radius:14px;overflow:hidden;background:#0b1327;color:inherit;text-align:left;font:inherit;box-shadow:0 10px 30px #0005;animation:fg-arrive .4s ease both}
.fg-reel.is-slim{aspect-ratio:16/5;margin-bottom:12px;border-radius:12px}
.fg-reel-stage,.fg-reel-stage img{position:absolute;inset:0;width:100%;height:100%}
.fg-reel-stage img{object-fit:cover;opacity:0;transition:opacity .26s ease;transform-origin:50% 45%}
.fg-reel-stage img.is-on{opacity:1;animation:fg-reel-push 3.6s ease-out both}
.fg-reel-bars{position:absolute;z-index:2;top:7px;left:9px;right:9px;display:flex;gap:4px}
.fg-reel-bars i{position:relative;flex:1;height:3px;border-radius:2px;background:#ffffff38;overflow:hidden}
.fg-reel-bars i.is-done{background:#ffffffd9}
.fg-reel-bars i.is-now::after{content:'';position:absolute;inset:0;background:var(--fg-gold);transform-origin:0 50%;animation:fg-reel-bar 3.2s linear both}
.fg-reel-tag{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:26px 12px 8px;background:linear-gradient(180deg,transparent,#070a1ae0 55%)}
.fg-reel-tag b{display:block;font-size:14px;line-height:1.25;color:#fff;letter-spacing:.01em}
.fg-reel-tag small{display:block;font-size:12px;line-height:1.35;color:#cfdbf1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fg-reel.is-tick .fg-reel-tag{animation:fg-arrive .3s ease both}
.fg-reel-note{position:absolute;z-index:2;top:16px;right:9px;padding:2px 6px;border-radius:6px;background:#0009;color:#ffffffb8;font-size:9px;letter-spacing:.06em}
.fg-reel-pause{position:absolute;z-index:3;left:50%;top:44%;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;background:#070a1acc;border:1px solid #ffffff55;opacity:0;transition:opacity .2s}
.fg-reel-pause::after{content:'';position:absolute;left:15px;top:11px;border-style:solid;border-width:8px 0 8px 12px;border-color:transparent transparent transparent #fff}
.fg-reel.is-paused .fg-reel-pause{opacity:1}
.fg-reel.is-paused .fg-reel-stage img.is-on,.fg-reel.is-paused .fg-reel-bars i.is-now::after{animation-play-state:paused}
.fg-reel.is-resting .fg-reel-bars i{background:#ffffffd9}
.fg-reel.is-slim .fg-reel-note{display:none}
.fg-reel.is-slim .fg-reel-tag{padding:18px 10px 6px}
.fg-reel.is-slim .fg-reel-tag b{font-size:13px}
.fg-reel.is-slim .fg-reel-tag small{font-size:11px}
.fg-reel.is-calm .fg-reel-stage img{transition:none;animation:none}
.fg-reel.is-calm .fg-reel-bars i.is-now::after{animation:none}
@keyframes fg-reel-push{from{transform:scale(1)}to{transform:scale(1.055)}}
@keyframes fg-reel-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.fg-reel-stage img,.fg-reel-stage img.is-on,.fg-reel-bars i.is-now::after,.fg-reel.is-tick .fg-reel-tag{animation:none;transition:none}}
@media(min-width:2400px){.fg-reel{border-radius:24px;margin-bottom:30px}.fg-reel-bars{top:14px;left:18px;right:18px;gap:8px}.fg-reel-bars i{height:6px}.fg-reel-tag{padding:50px 22px 16px}.fg-reel-tag b{font-size:28px}.fg-reel-tag small{font-size:22px}.fg-reel-note{top:30px;right:18px;font-size:17px;padding:4px 12px}}
/* Sign in with your phone (device sign-in). Its pieces are added by front-gate.js only when the server says it is
   switched on. Written for old TV browsers (the arcade.css rules): plain blocks and fixed px sizes first, scaled after. */
.fg-link-open[hidden],.fg-link-signed[hidden],.fg-link-grid[hidden],.fg-link-match[hidden],.fg-screens[hidden],#fg-link-qr-frame[hidden]{display:none}
/* A phone in hand signs in on itself: the button is for TVs, laptops and tablets. (A stuck quick check still offers it.) */
@media(pointer:coarse) and (max-width:899px){#fg-link-open{display:none}}
.fg-check button[data-link-open]{margin-left:14px}
#fg-link-panel{text-align:center}
.fg-link-grid{display:block}
.fg-link-qr{display:inline-block;vertical-align:middle;width:200px;height:200px;margin:2px 0 0;padding:9px}
.fg-link-words{display:inline-block;vertical-align:middle;max-width:100%;margin:8px 0 0 18px;text-align:left}
#fg-link-panel.is-typed .fg-link-words{margin-left:0;text-align:center}
.fg-link-or{margin:0;font-size:13px;line-height:1.4;color:var(--fg-muted)}
.fg-link-address{margin:2px 0 8px;font-size:17px;font-weight:800;line-height:1.3;color:var(--fg-ink);overflow-wrap:anywhere}
.fg-link-code{margin:2px 0 0;font:800 30px/1.2 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.1em;color:var(--fg-gold);white-space:nowrap}
.fg-link-match{margin:6px 0 0;padding:14px 12px;border:2px solid #ffd36e99;border-radius:18px;background:#1b274799}
.fg-link-match span{display:block;font-size:15px;font-weight:700;color:var(--fg-ink)}
.fg-link-match b{display:block;margin-top:4px;font:800 84px/1.05 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--fg-gold)}
.fg-link-signed{margin:12px 0 0;padding:8px 12px;border:1px solid #74cedc55;border-radius:10px;background:#17324955;font-size:13px;line-height:1.5;color:#d6e6f8;overflow-wrap:anywhere}
.fg-link-signed .fg-text-button{display:inline-block;min-height:36px;padding:4px 8px}
#fg-arcades-panel.is-screen .fg-account{display:none}
.fg-screens{margin-top:20px;border-top:1px solid #60779766;padding-top:2px}
.fg-screens .fg-button{margin-top:10px}
@media(max-width:560px){.fg-link-words{display:block;margin:10px 0 0;text-align:center}.fg-link-qr{width:176px;height:176px}.fg-link-code{font-size:26px}.fg-link-match b{font-size:64px}}
@media(max-height:620px){.fg-link-qr{width:150px;height:150px;padding:7px}.fg-link-match b{font-size:56px}.fg-link-match{padding:8px 12px}}
@media(min-width:900px){body[data-fg-step="link"] .fg-link-qr{width:calc(230 * var(--fg-u));height:calc(230 * var(--fg-u));min-width:150px;min-height:150px}body[data-fg-step="link"] .fg-link-or{font-size:max(13px,calc(15 * var(--fg-u)))}body[data-fg-step="link"] .fg-link-address{font-size:max(16px,calc(22 * var(--fg-u)))}body[data-fg-step="link"] .fg-link-code{font-size:max(26px,calc(38 * var(--fg-u)))}body[data-fg-step="link"] .fg-link-match b{font-size:max(64px,calc(96 * var(--fg-u)))}body[data-fg-step="link"] .fg-link-match span{font-size:max(15px,calc(17 * var(--fg-u)))}body[data-fg-step="link"] .fg-qr-wait{font-size:max(14px,calc(15 * var(--fg-u)))}}
@media(min-width:900px) and (max-height:620px){body[data-fg-step="link"] .fg-link-qr{width:150px;height:150px}}
@media(min-width:2400px){.fg-link-signed{font-size:22px;padding:14px 20px}}