/* Browsera homepage only. Real gameplay, three overlapping device frames.
   No screenshot crop, global UI change or animated decorative transform. */
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-showcase {
  --device-ink:#29241c;--device-paper:#fffdf7;--device-cream:#f7ecd3;
  position:relative;box-sizing:border-box;width:100%;max-width:760px;min-width:0;
  margin-inline:auto;container-type:inline-size;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-gallery {
  appearance:none;display:block;box-sizing:border-box;width:100%;min-width:0;
  margin:0;padding:0;border:0;background:none;box-shadow:none;
  color:var(--device-ink)!important;text-align:left;cursor:zoom-in;touch-action:manipulation;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-gallery:focus-visible {
  outline:3px solid #8c5a0c;outline-offset:5px;border-radius:16px;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-composition {
  position:relative;display:block;box-sizing:border-box;width:100%;aspect-ratio:1.30;
  isolation:isolate;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-device {
  position:absolute;display:block;box-sizing:border-box;min-width:0;
  border:2px solid var(--device-ink);background:var(--device-paper);
  box-shadow:3px 4px 0 var(--device-ink);overflow:hidden;pointer-events:none;
}
/* A large, upright desktop anchors the composition. Its actual game picture
   remains whole; phone/tablet overlap the frame in the reference arrangement. */
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-desktop {
  top:1%;left:9%;z-index:1;width:80%;padding:0 5px 7px;border-radius:13px 13px 8px 8px;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserbar {
  display:flex;align-items:center;box-sizing:border-box;gap:8px;
  height:clamp(17px,4.2cqw,29px);margin-inline:-5px;padding:0 10px;
  border-bottom:1px solid var(--device-ink);background:var(--device-cream);
  color:var(--device-ink);font:800 clamp(9px,1.8cqw,12px)/1.2 'Nunito Sans',sans-serif;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserdots {
  display:flex;flex:none;gap:4px;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserdots i {
  display:block;width:5px;height:5px;border:1px solid #9e7c3b;border-radius:50%;background:var(--device-paper);
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserdots i:first-child {background:#e4ac34}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-devicename {
  flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserbar svg {
  width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:1.4;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-screen {
  position:relative;display:block;box-sizing:border-box;min-width:0;width:100%;
  overflow:hidden;background:#1b211c;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-desktop .brx-motion-screen {aspect-ratio:1914/998}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-gallery .brx-motion-screen img,
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-gallery .brx-motion-screen video {
  position:absolute!important;inset:0;display:block!important;box-sizing:border-box;
  width:100%!important;max-width:none!important;height:100%!important;
  margin:0!important;padding:0!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;object-fit:contain;object-position:center;pointer-events:none;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-screen img {z-index:0}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-screen video {z-index:1;visibility:hidden}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-showcase[data-motion-state="playing"] .brx-motion-screen video {visibility:visible}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-tablet {
  bottom:4%;left:1.6%;z-index:2;width:47.5%;padding:7px 7px 7px 14px;
  border-radius:14px;background:var(--device-paper);transform:rotate(-3deg);transform-origin:center;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-tablet .brx-motion-screen {aspect-ratio:738/578;border-radius:5px}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-tablet-camera {
  position:absolute;left:5px;top:calc(50% - 2px);box-sizing:border-box;width:4px;height:4px;
  border:1px solid #8c6d2e;border-radius:50%;background:var(--device-cream);
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone {
  bottom:4%;right:2%;z-index:3;width:49.5%;padding:7px 7px 7px 13px;border-radius:17px;
  background:var(--device-paper);transform:rotate(3deg);transform-origin:center;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone .brx-motion-screen {aspect-ratio:952/532;border-radius:5px}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone-speaker {
  position:absolute;top:calc(50% - 7px);left:4px;width:3px;height:14px;border-radius:3px;background:var(--device-ink);
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone-home {
  position:absolute;top:38%;right:3px;width:2px;height:24%;border-radius:3px;background:#9e7c3b;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-actions {
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 14px;
  min-width:0;margin-top:4px;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-platforms {
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 10px;
  margin:0;color:#705333;font:800 11px/1.5 'Nunito Sans',sans-serif;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-platforms span+span::before {content:'·';margin-right:10px;color:#9e7c3b}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle {
  appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  box-sizing:border-box;min-height:32px;margin:0;padding:5px 10px;
  border:1px solid #b6a582;border-radius:7px;background:var(--device-paper);
  color:#705333;box-shadow:none;font:800 11px/1.4 'Nunito Sans',sans-serif;cursor:pointer;touch-action:manipulation;
}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle[hidden] {display:none!important}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle:hover {border-color:var(--device-ink);color:var(--device-ink)}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle:focus-visible {outline:3px solid #8c5a0c;outline-offset:3px}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle svg {width:12px;height:12px;fill:currentColor}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle .brx-motion-play-icon {display:none}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle[aria-pressed="true"] .brx-motion-pause-icon {display:none}
body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle[aria-pressed="true"] .brx-motion-play-icon {display:block}
@media(max-width:560px) {
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-showcase {max-width:500px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-composition {aspect-ratio:1.20}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-desktop {top:3%;left:5%;width:85%;padding:0 3px 5px;border-radius:10px 10px 6px 6px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserbar {margin-inline:-3px;padding-inline:6px;gap:6px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserdots {gap:3px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserdots i {width:4px;height:4px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-browserbar svg {width:12px;height:12px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-tablet {bottom:5%;left:1.6%;width:47.5%;padding:5px 5px 5px 10px;border-radius:10px;box-shadow:2px 3px 0 var(--device-ink)}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-tablet-camera {left:3px;width:3px;height:3px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone {bottom:5%;right:2%;width:49.5%;padding:4px 4px 4px 10px;border-radius:11px;box-shadow:2px 3px 0 var(--device-ink)}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone .brx-motion-screen {border-radius:4px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone-speaker {top:calc(50% - 5px);left:3px;width:2px;height:10px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-phone-home {right:2px;width:1px}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-platforms {font-size:10px}
}
@media(prefers-reduced-motion:reduce) {
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-showcase .brx-motion-screen video {display:none!important}
  body.br-public-site.br-fullsite #browsera-content .brx-home .brx-motion-toggle {display:none!important}
}
