/* Fonts used only by the game's fictional brand (SIL Open Font License, self-hosted so the share image can embed them) */
@font-face{font-family:"Anton";src:url("../fonts/game/Anton-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Comic Neue";src:url("../fonts/game/ComicNeue-700.woff2") format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Lobster";src:url("../fonts/game/Lobster-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Space Grotesk";src:url("../fonts/game/SpaceGrotesk-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Space Grotesk";src:url("../fonts/game/SpaceGrotesk-700.woff2") format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Yellowtail";src:url("../fonts/game/Yellowtail-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Fix This Brand: the game page. Interface uses the site tokens; the board shows the fictional client's brand. */
.page-game .fab,.page-game .pi-fab,.page-game .pi-teaser{display:none!important}
.ftb{padding:clamp(96px,11vw,128px) var(--gut) clamp(56px,7vw,96px);min-height:100svh}
.ftb noscript p{color:var(--sub)}

/* steps */
.ftb-top{min-height:28px;margin-bottom:clamp(14px,2vw,26px)}
.ftb-steps{display:flex;gap:6px;align-items:center;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--dim);opacity:0;transition:opacity .4s}
.has-steps .ftb-steps{opacity:1}
.ftb-steps li{display:flex;align-items:center;gap:6px}
.ftb-steps li+li::before{content:"";width:clamp(14px,3vw,36px);height:1px;background:var(--line)}
.ftb-steps li.done{color:var(--mute)}
.ftb-steps li.on{color:var(--red)}
.lang-ar .ftb-steps{font:500 12px var(--body);letter-spacing:0}

/* layout */
.ftb-stage{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(28px,4vw,72px);align-items:start}
.ftb-panel{order:0;min-width:0}
.ftb-view{order:1;position:sticky;top:88px;min-width:0}
.ftb-panel.in>*{animation:ftbIn .7s var(--ease) both}
.ftb-panel.in>*:nth-child(2){animation-delay:.05s}.ftb-panel.in>*:nth-child(3){animation-delay:.1s}.ftb-panel.in>*:nth-child(4){animation-delay:.15s}.ftb-panel.in>*:nth-child(n+5){animation-delay:.2s}
@keyframes ftbIn{from{opacity:0;transform:translateY(14px)}}

/* panel type */
.ftb-k{font:500 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.lang-ar .ftb-k{font:500 13px var(--body);letter-spacing:0}
.ftb-k2{margin-top:26px}
.ftb-h1{font:300 clamp(52px,6.6vw,108px)/.92 var(--display);letter-spacing:-.02em;margin:16px 0 0}
.ftb-h1 em,.ftb-h2 em{font-weight:700}
.lang-ar .ftb-h1{letter-spacing:0;line-height:1.15}
.ftb-h2{font:300 clamp(32px,3.4vw,52px)/1 var(--display);letter-spacing:-.015em;margin:12px 0 0}
.lang-ar .ftb-h2{letter-spacing:0;line-height:1.3}
.ftb-sub{font:400 clamp(18px,1.6vw,22px)/1.45 var(--display);color:var(--sub);margin-top:22px;max-width:30ch}
.ftb-p{color:var(--sub);margin-top:14px;max-width:46ch}
.ftb-note{font:400 12px var(--mono);color:var(--mute);margin-top:16px}
.lang-ar .ftb-note{font:400 13px var(--body)}
.ftb-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:28px}
.ftb .btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.ftb-link{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mute);border-bottom:1px solid var(--line2);padding:2px 0;transition:color .3s,border-color .3s}
.ftb-link:hover{color:var(--fg);border-color:var(--fg)}
.lang-ar .ftb-link{font:500 14px var(--body);letter-spacing:0}

/* brief */
.ftb-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.ftb-facts li{font:500 12px var(--body);padding:6px 11px;border-radius:99px;background:var(--chip);color:var(--chipfg)}
.ftb-issues{margin-top:12px;display:grid;gap:8px}
.ftb-issues li{display:flex;align-items:center;gap:12px;font-weight:500}
.ftb-issues span,.pin{flex:none;width:24px;height:24px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font:600 12px var(--mono)}
.ftb-goal{margin-top:22px;padding:16px 18px;border-inline-start:2px solid var(--red);background:var(--bg2);border-radius:0 12px 12px 0}
.lang-ar .ftb-goal{border-radius:12px 0 0 12px}
.ftb-goal p:last-child{margin-top:6px}

/* options */
.ftb-opts{display:grid;gap:10px;margin-top:22px}
.ftb-opt{display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:16px;text-align:start;background:var(--bg2);transition:border-color .3s,background .3s,opacity .3s,transform .4s var(--ease)}
@media (hover:hover){.ftb-opt:hover:not(:disabled){border-color:var(--line2);transform:translateX(4px)}.lang-ar .ftb-opt:hover:not(:disabled){transform:translateX(-4px)}}
.ftb-opt[aria-checked=true]{border-color:var(--red);background:color-mix(in srgb,var(--red) 9%,var(--bg2))}
.ftb-opt.is-off{opacity:.35}
.ftb-opt:disabled{cursor:default}
.ftb-opt-t{display:flex;flex-direction:column;gap:3px}
.ftb-opt-t b{font:600 17px var(--display)}
.ftb-opt-t span{font-size:14px;color:var(--mute);line-height:1.4}
.sw{position:relative;width:64px;height:64px;border-radius:12px;overflow:hidden;display:grid;place-items:center;--ck:10px;--dp:12px;--gr:5px}
.sw-pal{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;place-items:stretch;box-shadow:inset 0 0 0 1px var(--line)}
.sw-logo{font-size:15px}
.sw-sys .sys{position:absolute;inset:0;display:block}
.sw-sys .sys[data-sys=drip]{inset:0 0 30% 0}

.ftb-why{margin-top:18px;padding:18px 20px;border-radius:16px;background:var(--red);color:#fff}
.ftb-why .ftb-k{color:rgba(255,255,255,.75)}
.ftb-why p:last-child{margin-top:8px;font:500 17px/1.45 var(--display)}
.ftb-why.in{animation:ftbIn .6s var(--ease) both}

/* brand check */
.ftb-health{margin-top:30px;padding-top:18px;border-top:1px solid var(--line)}
.ftb-health ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}
.ftb-health li{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--mute)}
.ftb-health b{font:700 26px/1.1 var(--display);color:var(--red);transition:color .4s}
.ftb-health li.ok b{color:var(--fg)}
.ftb-health li.ok b::after{content:" ✓";font-size:.55em;color:#3ddc84;vertical-align:middle}

/* result */
.ftb-picks{margin-top:22px;border-top:1px solid var(--line)}
.ftb-picks li{display:grid;grid-template-columns:34px 1fr;gap:2px 10px;padding:12px 0;border-bottom:1px solid var(--line)}
.ftb-picks span{grid-row:span 2;font:500 12px var(--mono);color:var(--red);padding-top:4px}
.ftb-picks b{font:600 18px var(--display)}
.ftb-picks em{color:var(--mute);font-size:13px}
.ftb-real{margin-top:24px;padding:18px 20px;border-radius:16px;border:1px solid var(--line);background:var(--bg2)}
.ftb-real p:last-child{margin-top:8px;color:var(--sub)}
.ftb-more{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:20px}
.ftb-fine{margin-top:22px;font-size:12px;color:var(--mute);max-width:52ch}

/* ---------- Board ---------- */
.ftb-boardwrap{position:relative;container-type:inline-size;direction:ltr;border-radius:clamp(14px,1.8cqw,22px)}
.ftb-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:31cqw 29cqw;gap:1.5cqw}
.ftb-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--cut,50%)) 0 0);pointer-events:none}
.tile{position:relative;overflow:hidden;border-radius:1.6cqw;background:#E7E2DA;font-family:Arial,sans-serif;color:var(--ink)}
.tile.swap{animation:tileSwap .75s var(--ease) both;animation-delay:calc(var(--i) * 70ms)}
@keyframes tileSwap{0%{transform:scale(.95);filter:blur(5px) saturate(.4);opacity:.45}100%{transform:none;filter:none;opacity:1}}
.t-sign{grid-column:span 2}
.lgw{display:grid;place-items:center;line-height:1}

/* logos */
.lg{color:var(--ink);display:inline-flex;white-space:nowrap;line-height:1}
.lg-old1{font-family:'Lobster',cursive;text-shadow:.07em .07em 0 var(--acc);transform:rotate(-4deg)}
.lg-old2{font-family:'Comic Neue','Comic Sans MS',cursive;font-weight:700;font-size:.52em}
.lg-old3{font-family:Georgia,serif;font-style:italic;font-size:.5em;transform:scaleX(1.45)}
.lg-old4{font-family:Arial,sans-serif;font-weight:700;font-style:italic;font-size:.62em;letter-spacing:-.05em}
.lg-stack{flex-direction:column;align-items:center;font-family:'Anton',Impact,sans-serif;line-height:.84}
.lg-stack b{font-weight:400;display:block}
.lg-stack b:first-child{font-size:.46em;letter-spacing:.32em;margin:0 -.32em .12em 0}
.lg-stack i{font-style:normal;color:var(--acc)}
.lg-script{flex-direction:column;align-items:center;justify-content:center;width:2.15em;height:2.15em;border:.06em solid var(--ink);border-radius:50%;box-shadow:inset 0 0 0 .1em var(--bg),inset 0 0 0 .13em var(--acc)}
.lg-script b{font:400 .78em 'Yellowtail',cursive;color:var(--acc);margin-top:.05em}
.lg-script small{font:700 .2em 'Space Grotesk',sans-serif;letter-spacing:.42em;margin:.25em -.42em 0 0}
.lg-mark{align-items:center;gap:.28em}
.lg-mark .mk{width:1.05em;height:1.05em;border-radius:.26em;background:var(--acc);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.08em}
.lg-mark .mk b{display:block;width:.62em;height:.13em;border-radius:.1em;background:var(--bg)}
.lg-mark .mk b:nth-child(1){border-radius:.3em .3em .08em .08em;height:.17em}
.lg-mark .mk b:nth-child(2){width:.7em}
.lg-mark span{font:700 .6em 'Space Grotesk',sans-serif;letter-spacing:-.03em}

/* signature systems */
.sys{display:block}
.sys[data-sys=none]{display:none}
.sys[data-sys=checker]{background:conic-gradient(var(--ink) 25%,var(--bg) 0 50%,var(--ink) 0 75%,var(--bg) 0) 0 0/var(--ck,2.2cqw) var(--ck,2.2cqw)}
.sys[data-sys=drip]{background:linear-gradient(var(--acc),var(--acc)) top/100% 42% no-repeat,radial-gradient(ellipse 30% 58% at 50% 42%,var(--acc) 96%,transparent 100%) 0 0/var(--dp,3cqw) 100% repeat-x,radial-gradient(ellipse 22% 82% at 50% 42%,var(--acc) 96%,transparent 100%) calc(var(--dp,3cqw) * .5) 0/calc(var(--dp,3cqw) * 2.3) 100% repeat-x}
.sys[data-sys=grill]{background:repeating-linear-gradient(-55deg,var(--acc) 0 var(--gr,1.1cqw),var(--bg) 0 calc(var(--gr,1.1cqw) * 2.3))}
.sys[data-sys=clutter]{background:repeating-linear-gradient(90deg,#FFEB3B 0 2cqw,#FF00C8 0 4cqw,#00E5FF 0 6cqw)}

/* sign */
.t-sign{background:#CBC2B4 repeating-linear-gradient(0deg,transparent 0 2.4cqw,rgba(0,0,0,.06) 0 2.55cqw)}
.sg-board{position:absolute;left:5%;right:5%;top:7%;height:31%;display:grid;place-items:center;border-radius:.6cqw;box-shadow:0 .8cqw 1.4cqw rgba(0,0,0,.25)}
.sg-board .lgw{font-size:6.4cqw}
.t-sign.is-set .sg-board .lg-script{font-size:.62em}
.t-sign.is-set .sg-board .lg-stack{font-size:.68em}
.sg-awn{position:absolute;left:3%;right:3%;top:42%;height:9%;border-radius:0 0 .5cqw .5cqw;box-shadow:0 .6cqw 1cqw rgba(0,0,0,.2)}
.sg-awn[data-sys=none]{display:block;background:repeating-linear-gradient(90deg,#E53935 0 3cqw,#fff 0 6cqw)}
.sg-awn[data-sys=checker]{--ck:2.6cqw}
.sg-front{position:absolute;left:6%;right:6%;top:51%;bottom:0;display:grid;grid-template-columns:1fr .3fr;gap:2.5%}
.sg-win,.sg-door{background:linear-gradient(155deg,#46525f,#1c232c 55%,#2d3743);border:.5cqw solid #5f564c;border-bottom:0;position:relative}
.sg-win::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.12) 31% 38%,transparent 39%)}
.sg-win .ln{position:absolute;left:6%;right:6%;top:18%;font-size:1.6cqw;font-weight:700;color:var(--acc);letter-spacing:.04em;text-align:center}

/* social post */
.t-social{background:#ddd}
.so{position:absolute;inset:0}
.so-line{position:absolute;left:7%;right:7%;top:7%;font-size:2.7cqw;line-height:1.02;color:var(--ink);text-transform:uppercase}
.so .bgr{position:absolute;left:19%;width:62%;bottom:15%}
.so-lg{position:absolute;right:6%;bottom:5%;font-size:2.1cqw}
.so-lg .lg-script{font-size:.8em}
.so-sys{position:absolute;left:0;right:0;bottom:0;height:3.4%}
.so-sys[data-sys=checker],.so-sys[data-sys=grill],.so-sys[data-sys=drip]{left:0;right:auto;top:0;bottom:auto;width:100%;height:5%}
.so-sys[data-sys=drip]{height:9%}
.burst{position:absolute;right:5%;top:31%;width:9cqw;height:9cqw;display:grid;place-items:center;background:#FFEB3B;color:#E91E63;font:2cqw Impact,'Anton',sans-serif;transform:rotate(14deg);clip-path:polygon(50% 0,61% 15%,79% 9%,79% 28%,97% 33%,86% 50%,97% 67%,79% 72%,79% 91%,61% 85%,50% 100%,39% 85%,21% 91%,21% 72%,3% 67%,14% 50%,3% 33%,21% 28%,21% 9%,39% 15%)}
.t-social.is-set .so-line{text-transform:none}

/* burger box */
.bx{position:absolute;left:14%;right:14%;top:16%;bottom:12%;filter:drop-shadow(0 1.2cqw 1.2cqw rgba(0,0,0,.22))}
.bx-lid{height:38%;clip-path:polygon(9% 0,91% 0,100% 100%,0 100%);position:relative;overflow:hidden}
.bx-lid::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.18),rgba(0,0,0,.06))}
.bx-sys{position:absolute;left:0;right:0;bottom:0;height:30%}
.bx-sys[data-sys=drip]{top:0;bottom:auto;height:60%}
.bx-front{height:62%;display:grid;place-items:center;position:relative;border-top:.25cqw solid rgba(0,0,0,.18)}
.bx-front::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,0) 40%)}
.bx-front .lgw{font-size:3.4cqw;position:relative;z-index:1}

/* cup */
.cp{position:absolute;left:31%;right:31%;top:9%;bottom:6%;filter:drop-shadow(0 1cqw 1cqw rgba(0,0,0,.22))}
.cp-lid{height:9%;margin:0 -6%;border-radius:1cqw 1cqw .4cqw .4cqw;background:#F1F1F1;box-shadow:inset 0 -.4cqw 0 #d6d6d6}
.cp-body{height:91%;clip-path:polygon(0 0,100% 0,87% 100%,13% 100%);position:relative;overflow:hidden}
.cp-body::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.14),rgba(255,255,255,.1) 35%,rgba(0,0,0,.18))}
.cp-sys{position:absolute;left:0;right:0;top:52%;height:24%}
.cp-sys[data-sys=checker]{--ck:1.8cqw}
.cp-body .lgw{position:absolute;left:0;right:0;top:20%;font-size:2.4cqw;z-index:1}
.cp-body .lg-old3{font-size:.4em}
.cp-body .lg-old2{font-size:.36em}

/* delivery app */
.t-app{background:#D9D4CC}
.ap{position:absolute;left:20%;right:20%;top:8%;bottom:-12%;background:#0e0e0e;border-radius:2.4cqw;padding:.9cqw}
.ap-scr{position:relative;height:100%;background:#fff;border-radius:1.7cqw;overflow:hidden}
.ap-hero{height:46%;position:relative;overflow:hidden}
.ap-hero .bgr{position:absolute;width:60%;left:30%;bottom:-8%}
.ap-sys{position:absolute;left:0;right:0;top:0;height:12%}
.ap-sys[data-sys=checker]{--ck:1.6cqw}
.ap-badge{position:absolute;left:8%;top:30%;width:8.2cqw;height:8.2cqw;border-radius:50%;border:.45cqw solid #fff;display:grid;place-items:center;overflow:hidden}
.ap-badge .lgw{font-size:1.9cqw}
.ap-badge .lg-old2,.ap-badge .lg-old3{font-size:.32em}
.ap-badge .lg-old1{font-size:.6em}
.ap-badge .lg-mark span{display:none}
.ap-badge .lg-mark .mk{font-size:2.3em}
.ap-badge .lg-script{font-size:1.05em;border:0;box-shadow:none}
.ap-badge .lg-stack{font-size:.95em}
.ap-name{margin:4.4cqw 8% 0;font-size:1.65cqw;font-weight:700;color:#111}
.ap-meta{margin:.3cqw 8% 0;font:1.05cqw Arial,sans-serif;color:#777}
.ap-bar{display:block;height:.9cqw;margin:1.2cqw 8% 0;border-radius:.4cqw;background:#eee}
.ap-bar.s{width:46%}

/* issue pins and compare handle */
.ftb-pins{position:absolute;inset:0;pointer-events:none}
.pin{position:absolute;box-shadow:0 0 0 0 rgba(240,63,53,.6);animation:pinPulse 1.8s infinite;animation-delay:calc(var(--i) * .25s)}
@keyframes pinPulse{70%{box-shadow:0 0 0 12px rgba(240,63,53,0)}}
.p-sign{left:3%;top:2.5%}.p-social{left:69.5%;top:2.5%}.p-box{left:3%;top:54%}.p-app{left:69.5%;top:54%}
.cmp-tag{position:absolute;bottom:2.5%;padding:5px 10px;border-radius:99px;background:rgba(10,10,10,.75);color:#fff;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;z-index:3}
.cmp-tag.l{left:1.5%}.cmp-tag.r{right:1.5%;background:var(--red)}
.cmp-handle{position:absolute;top:0;bottom:0;left:var(--cut,50%);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.2);z-index:3}
.cmp-handle i{position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-style:normal;font-size:18px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.cmp-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4;-webkit-appearance:none;appearance:none;background:none}
.cmp-range:focus-visible+*,.ftb-boardwrap:has(.cmp-range:focus-visible){outline:2px solid var(--red);outline-offset:4px}

/* phones and tablets */
@media (max-width:960px){
  .ftb-stage{grid-template-columns:1fr;gap:22px}
  .ftb-view{position:static}
  .s-brief .ftb-view,.s-decide .ftb-view,.s-result .ftb-view{order:-1}
  .s-decide .ftb-view,.s-result .ftb-view{position:sticky;top:64px;z-index:5;background:var(--bg);padding:6px 0 12px;margin:0 calc(var(--gut) * -1);padding-inline:var(--gut);box-shadow:0 12px 18px -14px rgba(0,0,0,.5)}
  .ftb-h1{font-size:clamp(46px,13vw,72px)}
  .ftb-sub{max-width:none}
  .ftb-health ul{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ftb-health b{font-size:22px}
  .ftb-opt{grid-template-columns:52px minmax(0,1fr);gap:12px;padding:10px}
  .sw{width:52px;height:52px}
  .sw-logo{font-size:12px}
  .ftb-opt-t b{font-size:16px}
  .cmp-tag{font-size:9.5px;padding:3px 7px}
  .cmp-handle i{width:32px;height:32px;margin:-16px 0 0 -16px;font-size:15px}
}
@media (prefers-reduced-motion:reduce){.pin{animation:none}.ftb-opt{transition:none}}

/* zoom hint and tiles as buttons */
.ftb-hint{margin-top:10px;font:400 11px var(--mono);letter-spacing:.06em;color:var(--mute);text-align:end}
.lang-ar .ftb-hint{font:400 12px var(--body);letter-spacing:0}
.s-result .ftb-hint{display:none}
.ftb-board .tile{cursor:zoom-in;transition:box-shadow .3s}
.ftb-board .tile:focus-visible{outline:2px solid var(--red);outline-offset:2px}
@media (hover:hover){.ftb-board .tile:hover{box-shadow:0 0 0 2px var(--red)}}

/* the owner's reaction */
.ftb-mo{display:flex;align-items:flex-start;gap:12px;margin-top:16px;padding:14px 16px;border-radius:4px 16px 16px 16px;background:var(--panel2);border:1px solid var(--line);position:relative}
.lang-ar .ftb-mo{border-radius:16px 4px 16px 16px}
.ftb-mo.pop{animation:moPop .5s var(--ease) both}
@keyframes moPop{from{opacity:0;transform:translateY(8px) scale(.98)}}
.mo-av{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#FFD23F;color:#121212;font:700 15px 'Space Grotesk',Arial,sans-serif}
.mo-n{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.lang-ar .mo-n{font:500 12px var(--body);letter-spacing:0}
.mo-t{margin-top:3px;font:500 16px/1.4 var(--display)}
.ftb-mo.doubt{border-color:color-mix(in srgb,#F2A900 55%,transparent)}
.mo-flag{position:absolute;top:-9px;inset-inline-end:14px;width:20px;height:20px;border-radius:50%;background:#F2A900;color:#121212;display:grid;place-items:center;font:700 12px var(--mono)}
.ftb-mo.is-verdict{margin-top:20px}
.ftb-why-d{margin-top:10px!important;padding-top:10px;border-top:1px solid rgba(255,255,255,.3);font:400 14px/1.45 var(--body)!important}

/* share */
.ftb-share{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.ftb-share .btn[disabled]{opacity:.6}
.ftb-toast{font:500 12px var(--mono);color:#3ddc84;opacity:0;transition:opacity .3s}
.ftb-toast.on{opacity:1}

/* free brand check */
.ftb-check{margin-top:28px;padding:clamp(20px,2.4vw,28px);border-radius:18px;border:1px dashed var(--line2);background:var(--bg2)}
.ftb-check h3{font:300 clamp(26px,2.6vw,36px)/1.05 var(--display);margin:8px 0 0}
.ftb-check>p:not(.ftb-k){color:var(--sub);margin:10px 0 18px;max-width:52ch}
.ftb-form{display:grid;gap:12px}
.ftb-form label{display:grid;gap:6px;font-size:13px;color:var(--mute)}
.ftb-form input{font:inherit;font-size:16px;color:var(--fg);background:var(--field);border:1px solid var(--line);border-radius:12px;padding:12px 14px;outline:0;transition:border-color .3s}
.ftb-form input:focus{border-color:var(--red)}
.ftb-form .btn{justify-self:start}
.ftb-form .hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0}
.ftb-fstat{font-size:14px;min-height:1px}
.ftb-fstat.ok{color:#3ddc84}.ftb-fstat.err{color:var(--red)}

/* zoom */
.ftb-zoom{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px;background:rgba(6,6,6,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .25s}
.ftb-zoom.on{opacity:1}
.ftb-zoom[hidden]{display:none}
.zm-in{display:grid;gap:12px;transform:scale(.96);transition:transform .4s var(--ease)}
.ftb-zoom.on .zm-in{transform:none}
.zm-bar{display:flex;justify-content:space-between;align-items:center;gap:12px}
.zm-bar .ftb-k{color:#ccc}
.zm-x{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:8px 14px;border-radius:99px;border:1px solid rgba(255,255,255,.3)}
.zm-box{overflow:hidden;border-radius:14px;direction:ltr}
.zb{container-type:inline-size}
.zb .tile{border-radius:14px;cursor:default}
html.ftb-zooming{overflow:hidden}

/* downloadable result card (rendered off screen, then saved as an image) */
.ftb-card{position:fixed;left:0;top:-30000px;width:1080px;padding:64px;background:#0A0A0A;color:#fff;font-family:var(--body)}
.cd-top{display:flex;justify-content:space-between;align-items:center;font:500 18px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8C8C8C}
.cd-top img{height:58px;width:auto}
.cd-k{margin-top:56px;font:500 18px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#F03F35}
.ftb-card.lang-ar .cd-k,.ftb-card.lang-ar .cd-top span{letter-spacing:0}
.cd-h{font:300 76px/1 var(--display);letter-spacing:-.02em;margin:14px 0 40px}
.ftb-card.lang-ar .cd-h{letter-spacing:0;line-height:1.3}
.cd-h em{font-weight:700}
.cd-board .tile{cursor:default}
.cd-picks{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.cd-picks li{font:500 20px var(--body);padding:10px 18px;border-radius:99px;background:#1f1f1f;color:#ddd}
.cd-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:44px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);font-size:16px;color:#8C8C8C}
.cd-foot b{font:600 24px var(--display);color:#fff;white-space:nowrap}