/* Approved v2 composition, with later user-requested section spacing.
   One unit equals one pixel of the 887px-wide reference.
   Illustration layers contain no UI; all copy, navigation and controls are live. */
.ub-site { --u: calc(min(100vw, 1600px) / 887); background: #fff9e9; }
.ub-site #main, .ub-site .game-header, .ub-site .game-footer { width: min(100%, 1600px); margin-inline: auto; }
.ub-site section { position: relative; padding: 0; overflow: hidden; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ub-site .game-header { padding: calc(8 * var(--u)) calc(60 * var(--u)); min-height: 0; height: max(44px, calc(44 * var(--u))); }
.ub-site .game-header .brand { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; width: auto; height: auto; overflow: visible; }
.game-wordmark { display: block; width: calc(116 * var(--u)); height: auto; flex: none; }
.ub-site .game-header .brand .game-wordmark { width: calc(116 * var(--u)); height: auto; }
.ub-site .site-header nav { gap: calc(24 * var(--u)); font-size: calc(12 * var(--u)); color: white; }
.ub-site .site-header nav a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; }
.ub-site .site-header .nav-cta { position: relative; isolation: isolate; min-height: 44px; padding: 0 calc(17 * var(--u)); color: #082138; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.ub-site .nav-cta::before { content: ''; position: absolute; z-index: -1; top: 50%; left: 0; right: 0; height: calc(26 * var(--u)); transform: translateY(-50%); background: var(--yellow); border: 1px solid var(--navy); border-radius: calc(2 * var(--u)); box-shadow: 0 calc(2 * var(--u)) #736018; }
.ub-site .hero { min-height: 0; height: calc(585 * var(--u)); background: #32b7f6; }
.hero-art { position: absolute; left: 0; top: 50%; width: 100%; aspect-ratio: 1536 / 1024; transform: translateY(-50%); }
.hero-scene { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.hero-game-worker { position: absolute; left: 77.018%; top: 26.27%; width: 7.8125%; height: auto; image-rendering: pixelated; }
.ub-site .hero-copy { position: absolute; inset: 0; width: 100%; padding: 0; }
.ub-site .hero-logo { position: absolute; left: calc(137 * var(--u)); top: calc(48 * var(--u)); width: calc(193 * var(--u)); margin: 0; filter: none; }
.ub-site .hero h1 { position: absolute; left: calc(128 * var(--u)); top: calc(248 * var(--u)); font-size: calc(58 * var(--u)); line-height: 1.04; letter-spacing: -.025em; margin: 0; color: #061f38; }
.ub-site .hero-copy > p { position: absolute; left: calc(130 * var(--u)); top: calc(385 * var(--u)); font-size: calc(16 * var(--u)); font-weight: 750; line-height: 1.5; margin: 0; }
.ub-site .store-links { display: flex; gap: calc(10 * var(--u)); flex-wrap: nowrap; }
.ub-site .hero .store-links { position: absolute; left: calc(121 * var(--u)); top: calc(418 * var(--u)); }
.ub-site .store-button { min-height: max(44px, calc(42 * var(--u))); padding: calc(7 * var(--u)) calc(12 * var(--u)); gap: calc(8 * var(--u)); font-size: calc(13 * var(--u)); border-radius: calc(6 * var(--u)); border: 2px solid #fff8e7; border-right-color: #74a9c3; border-bottom: 5px solid #74a9c3; outline: 1px solid #071c2b; outline-offset: 0; background: #082138; box-shadow: none; filter: none; line-height: 1.2; transition: transform .15s ease, background-color .15s ease; }
.ub-site .store-button:hover { background: #082846; transform: translateY(-1px); box-shadow: none; }
.ub-site .store-button:active { background: #071c2b; transform: translateY(2px); box-shadow: none; }
.ub-site .store-button:focus-visible { outline: 4px solid #ed7815; outline-offset: 5px; }
.ub-site .store-button svg { width: calc(19 * var(--u)); height: calc(23 * var(--u)); }
.ub-site .store-button small { font-size: calc(7 * var(--u)); line-height: 1.25; margin-bottom: calc(2 * var(--u)); }
.ub-site .site-sign { z-index: 3; padding: calc(8 * var(--u)) calc(10 * var(--u)); border: calc(3 * var(--u)) solid #122b3b; outline: calc(2 * var(--u)) solid #e5a824; outline-offset: calc(-6 * var(--u)); box-shadow: calc(2 * var(--u)) calc(3 * var(--u)) #81612d; border-radius: calc(3 * var(--u)); font: calc(21 * var(--u))/1.2 var(--display); background: #fff5d9; }
.ub-site .site-sign::before, .ub-site .site-sign::after { width: calc(5 * var(--u)); height: calc(5 * var(--u)); top: calc(3 * var(--u)); }
.ub-site .record-sign { left: calc(552 * var(--u)); bottom: calc(75 * var(--u)); transform: rotate(-1deg); }
.ub-site .crane-sign { top: calc(116 * var(--u)); right: calc(16 * var(--u)); font-size: calc(18 * var(--u)); transform: rotate(1deg); }
/* Cream instructions: separate horizontal flip and vertical stack diagrams. */
.ub-site .how { height: calc(384 * var(--u)); background: #fffbee; }
.ub-site .how h2 { position: absolute; top: calc(25 * var(--u)); width: 100%; display: flex; align-items: center; justify-content: center; gap: calc(24 * var(--u)); font-size: calc(30 * var(--u)); line-height: 1.4; }
.bolt { width: calc(18 * var(--u)); height: calc(20 * var(--u)); flex-shrink: 0; }
.ub-site .how-grid { position: absolute; inset: calc(97 * var(--u)) 0 calc(32 * var(--u)); display: block; margin: 0; }
.ub-site .instruction { position: absolute; top: 0; bottom: 0; padding: 0; }
.ub-site .flip-instruction { left: calc(53 * var(--u)); width: calc(402 * var(--u)); }
.ub-site .stack-instruction { left: calc(455 * var(--u)); right: calc(30 * var(--u)); border: 0; }
.ub-site .stack-instruction::before { content: ''; position: absolute; top: calc(26 * var(--u)); bottom: calc(-9 * var(--u)); left: 0; width: 1px; background: #a7b9b6; }
.ub-site .flip-diagram { position: absolute; top: calc(56 * var(--u)); left: calc(18 * var(--u)); width: calc(354 * var(--u)); height: calc(80 * var(--u)); gap: calc(12 * var(--u)); }
.ub-site .flip-diagram .floor { width: calc(142 * var(--u)); height: calc(76 * var(--u)); }
.ub-site .flip-diagram > .diagram-arrow { width: calc(52 * var(--u)); height: calc(41 * var(--u)); }
.ub-site .stack-diagram { position: absolute; top: calc(4 * var(--u)); left: calc(128 * var(--u)); width: calc(175 * var(--u)); height: calc(174 * var(--u)); justify-content: space-between; }
.ub-site .stack-diagram .floor { width: 100%; }
.ub-site .stack-diagram > .diagram-arrow { width: calc(25 * var(--u)); height: calc(28 * var(--u)); margin: calc(-4 * var(--u)) 0; position: relative; z-index: 1; }
.ub-site .instruction h3 { position: absolute; top: calc(160 * var(--u)); width: 100%; font-size: calc(22 * var(--u)); line-height: 1.4; margin: 0; }
.ub-site .instruction p { position: absolute; top: calc(199 * var(--u)); width: 100%; font-size: calc(17 * var(--u)); line-height: 1.4; }
.ub-site .stack-instruction h3 { top: calc(182 * var(--u)); padding-left: calc(24 * var(--u)); }
.ub-site .stack-instruction p { top: calc(220 * var(--u)); padding-left: calc(24 * var(--u)); }
.ub-site .how-summary { position: absolute; bottom: calc(13 * var(--u)); width: 100%; display: flex; align-items: center; justify-content: center; gap: calc(12 * var(--u)); font-size: calc(14 * var(--u)); line-height: 1.4; }
.ub-site .how-summary span { margin: 0; color: #082138; }
.ub-site .how-summary .bolt { width: calc(14 * var(--u)); height: calc(16 * var(--u)); }
/* Approved 1536 × 1024 embedded-game proposal; copy and controls stay live. */
.ub-site .feel { --d: calc(min(100vw, 1600px) / 1536); height: max(560px, calc(1024 * var(--d))); background: #082846 url('/assets/ub/landing-v3/demo-city.png') center / cover no-repeat; }
.ub-site .feel::before { display: none; }
.ub-site .feel-copy { position: absolute; left: calc(80 * var(--d)); top: calc(181 * var(--d)); padding: 0; width: calc(600 * var(--d)); }
.ub-site .demo-kicker { display: block; color: #ffd43d; font: calc(32 * var(--d))/1.35 var(--display); }
.ub-site .feel h2 { margin: calc(24 * var(--d)) 0 calc(28 * var(--d)); font-size: calc(100 * var(--d)); line-height: 1.12; letter-spacing: -.025em; }
.ub-site .feel h2 em { font-size: 1.2em; }
.ub-site .feel-copy > p { margin: 0; font-size: calc(30 * var(--d)); line-height: 1.6; font-weight: 550; color: #fff8e7; }
.ub-site .demo-cabinet { position: absolute; top: 0; right: calc(50 * var(--d)); width: calc(780 * var(--d)); height: 100%; }
.ub-site .demo-frame { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; z-index: 3; pointer-events: none; }
.ub-site #demo-title { position: absolute; z-index: 4; left: 8.33%; top: 5.08%; margin: 0; color: #fff8e7; font: calc(43 * var(--d))/1.2 var(--display); white-space: nowrap; }
.ub-site .demo-options { position: absolute; z-index: 5; right: 13.2%; top: 4.5%; display: flex; flex-wrap: nowrap; gap: calc(24 * var(--d)); }
.ub-site .demo-options button { position: relative; display: grid; place-items: center; width: max(44px, calc(64 * var(--d))); height: max(44px, calc(64 * var(--d))); min-height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #fff8e7; }
.ub-site .demo-options button:hover { background: transparent; filter: brightness(1.15); }
.ub-site .demo-options .demo-option-icon { position: relative; width: 52%; height: 52%; margin-top: -5%; }
.ub-site #sound-toggle[aria-pressed="true"] { color: #ffd43d; }
.ub-site #sound-toggle[aria-pressed="true"] .muted-line { display: none; }
.ub-site .demo-playfield { position: absolute; left: 5.2564%; top: 11.5234%; width: 88.9744%; height: 60.9375%; overflow: hidden; background: #38b5fa url('/assets/ub/sky.webp') center bottom / 100% 133% no-repeat; }
.ub-site .demo-score { position: absolute; z-index: 2; left: 3.4%; right: auto; top: 2.7%; display: flex; align-items: baseline; gap: calc(4 * var(--d)); color: #ffd43d; font-family: var(--display); -webkit-text-stroke: calc(6 * var(--d)) #071c2b; paint-order: stroke fill; }
.ub-site .demo-score #demo-count { font-size: calc(var(--count-size, 74) * var(--d)); line-height: 1; font-variant-numeric: tabular-nums; }
.ub-site .demo-score .demo-unit { color: #fff8e7; font-size: calc(42 * var(--d)); }
.ub-site .demo-scene { position: absolute; --joint: 81%; --incoming-y: 4%; --stack-y: 39%; left: 24%; top: 0; width: 48%; height: 100%; min-height: 0; max-width: none; margin: 0; }
.ub-site .demo-incoming { width: 100%; left: 0; top: var(--incoming-y); }
.ub-site .demo-stack { width: 100%; left: 0; top: var(--stack-y); }
.ub-site .demo-stack .floor + .floor { margin-top: -4.7%; }
.ub-site .demo-drop-guide { position: absolute; left: 46%; top: calc(var(--incoming-y) + var(--step, 0px) * 1.121 + 6 * var(--d)); width: 8%; height: max(12px, calc(var(--drop, 60px) - var(--step, 0px) * .121 - 12 * var(--d))); }
.ub-site .demo-scene .floor > img { height: 153%; top: -21%; clip-path: inset(23% 0 27%); }
.ub-site .demo-scene .floor-cap { position: absolute; top: 0; left: -4.7%; width: 109.5%; height: 17%; background: url('/assets/ub/floor-facade.png') center 7.5% / 100% 560%; image-rendering: pixelated; }
.ub-site .demo-incoming .floor::after { content: ''; position: absolute; top: 83%; left: -4.7%; width: 109.5%; height: 17%; background: url('/assets/ub/floor-facade.png') center 7.5% / 100% 560%; image-rendering: pixelated; }
.ub-site .demo-scene .steel { z-index: 1; }
.ub-site .demo-worker { position: absolute; right: .5%; top: 9%; width: 21.5%; height: auto; image-rendering: pixelated; pointer-events: none; }
.ub-site .demo-playfield::before { content: ''; position: absolute; right: 5.2%; top: 0; width: calc(3 * var(--d)); height: 24%; border-left: 1px solid #071c2b; border-right: 1px solid #74a9c3; }
.ub-site .impact { left: var(--joint); top: calc(var(--stack-y) + var(--step, 0px) * .232); opacity: 1; z-index: 2; }
.ub-site .impact b { left: calc(26 * var(--d)); right: auto; bottom: calc(10 * var(--d)); font-size: calc(43 * var(--d)); color: #ffd43d; -webkit-text-stroke: calc(5 * var(--d)) #071c2b; paint-order: stroke fill; }
.ub-site .impact i { width: calc(7 * var(--d)); height: calc(7 * var(--d)); transform: rotate(calc(var(--i)*45deg)) translateX(calc(33 * var(--d))); box-shadow: none; }
.ub-site .land .impact { top: calc(var(--stack-y) + var(--step, 0px) * .8763); }
.ub-site .demo-interaction { position: absolute; z-index: 4; left: 10.5%; top: 74%; width: 79%; height: 21.4%; }
.ub-site .demo-status { position: absolute; top: 0; left: 0; width: 100%; max-width: none; min-height: 0; margin: 0; color: #fff8e7; font-size: max(14px, calc(24 * var(--d))) !important; line-height: 1.35; text-align: center; }
.ub-site .demo-controls { position: absolute; top: max(24px, calc(37 * var(--d))); left: 0; width: 100%; max-width: none; display: flex; gap: calc(22 * var(--d)); margin: 0; }
.ub-site .game-button { width: calc(50% - 11 * var(--d)); }
.ub-site .game-button span { top: calc(100% + 3 * var(--d)); font-size: calc(31 * var(--d)); line-height: 1.15; }
/* The changing world is one continuous panorama, without rasterized UI. */
.ub-site .journey { height: calc(265 * var(--u)); }
.ub-site .journey::after { display: none; }
.journey-scene { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: fill; }
.journey-copy { position: absolute; left: calc(55 * var(--u)); top: calc(22 * var(--u)); }
.ub-site .journey h2 { font-size: calc(34 * var(--u)); line-height: 1.4; margin: 0 0 calc(3 * var(--u)); text-shadow: 0 2px #248ec3; }
.ub-site .journey p { font-size: calc(16 * var(--u)); text-shadow: 0 1px 3px #082846; }
.ub-site .download { height: calc(180 * var(--u)); background: #fffbee; }
.download-art { position: absolute; inset: 0; background: url('/assets/ub/landing-v3/download-scene-empty.webp') center bottom / 100% calc(230 * var(--u)) no-repeat; }
.download-game-builder { position: absolute; left: 19.15%; bottom: calc(24.8 * var(--u)); width: calc(68.6 * var(--u)); height: auto; image-rendering: pixelated; }
.download-copy { position: absolute; left: calc(305 * var(--u)); top: calc(47 * var(--u)); }
.ub-site .download h2 { font-size: calc(21 * var(--u)); margin: 0 0 calc(9 * var(--u)); line-height: 1.5; }
.ub-site .download .store-links { justify-content: center; }
.ub-site .final-sign { display: grid; place-items: center; position: absolute; right: calc(72 * var(--u)); top: auto; bottom: calc(53 * var(--u)); width: calc(100 * var(--u)); height: calc(40 * var(--u)); font-size: calc(18 * var(--u)); padding: 0; margin: 0; transform: none; border: 0; outline: 0; box-shadow: none; background: transparent; }
.ub-site .final-sign::before, .ub-site .final-sign::after { display: none; }
.ub-site .game-footer { height: calc(75 * var(--u)); padding: calc(11 * var(--u)) calc(60 * var(--u)); background: #082846; display: flex; align-items: flex-start; justify-content: space-between; gap: 0; position: relative; }
.footer-brand { display: flex; align-items: center; gap: calc(22 * var(--u)); min-height: 44px; }
.footer-brand .game-wordmark { width: calc(116 * var(--u)); height: auto; }
.footer-brand > a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; }
.ub-site .site-footer nav { display: flex; gap: calc(19 * var(--u)); margin: 0; font-size: calc(10 * var(--u)); }
.ub-site .site-footer nav a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; padding: 0; }
.ub-site .site-footer small { position: absolute; bottom: calc(13 * var(--u)); left: calc(60 * var(--u)); font-size: calc(8 * var(--u)); }
/* Mobile is a deliberate reflow of the same scenes and controls. */
@media (max-width: 760px) {
 .ub-site { --u: 1px; }
 .ub-site .game-header { height: 66px; padding: 10px 20px; }
 .ub-site .game-header .brand .game-wordmark { width: 106px; }
 .ub-site .site-header nav { gap: 15px; font-size: 12px; }
 .ub-site .site-header .nav-cta { padding: 9px 11px; }
 .ub-site .hero { height: 980px; }
 .hero-art { width: 810px; height: 540px; left: calc(80% - 648px); top: auto; bottom: 0; transform: none; }
 .ub-site .hero::after { content: ''; position: absolute; top: 440px; left: 0; right: 0; height: 50px; background: linear-gradient(#32b7f6,transparent); }
 .ub-site .hero-copy { z-index: 2; text-align: center; }
 .ub-site .hero-logo { width: 175px; top: 76px; left: calc(50% - 87.5px); }
 .ub-site .hero h1 { top: 260px; left: 0; width: 100%; font-size: 53px; line-height: 1.07; }
 .ub-site .hero-copy > p { top: 386px; left: 0; width: 100%; font-size: 15px; }
 .ub-site .hero .store-links { top: 426px; left: 0; width: 100%; justify-content: center; }
 .ub-site .store-button { min-height: 53px; padding: 9px 15px; font-size: 14px; border-radius: 6px; }
 .ub-site .store-button small { font-size: 9px; }
 .ub-site .store-button svg { width: 22px; height: 25px; }
 .ub-site .record-sign { left: 49%; bottom: 85px; font-size: 18px; }
 .ub-site .crane-sign { top: 506px; right: 14px; font-size: 15px; }
 .ub-site .how { height: 660px; }
 .ub-site .how h2 { top: 30px; font-size: clamp(20px, 5.7vw, 29px); gap: 13px; }
 .ub-site .how h2 .bolt { width: 14px; height: 16px; }
 .ub-site .how-grid { inset: 102px 0 50px; }
 .ub-site .flip-instruction { left: calc(50% - 165px); width: 330px; height: 206px; }
 .ub-site .flip-diagram { top: 24px; left: 16px; width: 298px; height: 80px; gap: 9px; }
 .ub-site .flip-diagram .floor { width: 121px; }
 .ub-site .flip-diagram > .diagram-arrow { width: 38px; height: 36px; }
 .ub-site .instruction h3 { top: 124px; font-size: 23px; }
 .ub-site .instruction p { top: 164px; font-size: 16px; }
 .ub-site .stack-instruction { top: 213px; left: calc(50% - 165px); width: 330px; right: auto; height: 256px; border: 0; }
 .ub-site .stack-instruction::before { inset: 0 20px auto; width: auto; height: 1px; }
 .ub-site .stack-diagram { top: 25px; left: 85px; width: 160px; height: 159px; }
 .ub-site .stack-instruction h3 { top: 194px; padding: 0; }
 .ub-site .stack-instruction p { top: 234px; padding: 0; }
 .ub-site .how-summary { bottom: 23px; font-size: 12px; gap: 8px; }
 .ub-site .feel { --d: calc((100vw - 24px) / 780); height: auto; padding: 36px 12px 0; background-position: 38% bottom; }
 .ub-site .feel-copy { position: relative; left: auto; top: auto; width: 100%; text-align: center; }
 .ub-site .demo-kicker { font-size: 18px; }
 .ub-site .feel h2 { margin: 13px 0 18px; font-size: clamp(39px, 11vw, 64px); line-height: 1.08; }
 .ub-site .feel-copy > p { font-size: 16px; line-height: 1.6; }
 .ub-site .demo-cabinet { position: relative; top: auto; right: auto; width: 100%; height: max(620px, calc(min(100vw - 24px, 560px) * 1024 / 780)); margin: 26px auto 0; max-width: 560px; }
 .ub-site #demo-title { top: 4.6%; left: 8%; font-size: clamp(16px, 4.5vw, 25px); }
 .ub-site .demo-options { top: 3.4%; right: 12%; gap: 6px; }
 .ub-site .demo-options button { width: 44px; height: 44px; }
 .ub-site .demo-score #demo-count { font-size: calc(var(--count-size, 74) * .5px); }
 .ub-site .demo-score .demo-unit { font-size: 23px; }
 .ub-site .demo-score { -webkit-text-stroke: 3px #071c2b; }
 .ub-site .demo-scene { --incoming-y: 15%; --stack-y: 48%; left: 22%; width: 56%; }
 .ub-site .demo-worker { top: 13%; width: 24%; right: -1%; }
 .ub-site .impact b { left: 12px; bottom: 6px; font-size: 25px; -webkit-text-stroke: 3px #071c2b; }
 .ub-site .demo-interaction { left: 12%; width: 76%; top: 74%; height: 22%; }
 .ub-site .demo-status { font-size: 14px !important; line-height: 1.3; }
 .ub-site .demo-controls { top: 42px; gap: 10px; }
 .ub-site .game-button { width: calc(50% - 5px); }
 .ub-site .game-button span { top: calc(100% + 3px); font-size: 18px; }
 .ub-site .journey { height: 340px; }
 .journey-scene { object-fit: cover; object-position: 58% bottom; }
 .journey-copy { left: 23px; right: 23px; top: 23px; }
 .ub-site .journey h2 { max-width: none; font-size: 26px; }
 .ub-site .journey p { font-size: 13px; }
 .ub-site .download { height: 328px; }
 .download-art { height: 126px; top: auto; background-size: 620px 230px; background-position: 34% bottom; }
 .download-game-builder { left: calc(34% - 92.06px); bottom: 24.8px; width: 54px; }
 .download-copy { top: 56px; left: 0; width: 100%; }
 .ub-site .download h2 { font-size: clamp(20px,5.6vw,25px); margin-bottom: 15px; }
 .ub-site .final-sign { display: none; }
 .ub-site .game-footer { height: 154px; padding: 19px 23px; flex-direction: column; justify-content: flex-start; }
 .footer-brand { gap: 20px; }
 .footer-brand .game-wordmark { width: 106px; }
 .ub-site .site-footer nav { font-size: 11px; }
 .ub-site .site-footer small { bottom: 19px; left: 23px; font-size: 10px; }
}
@media (max-width: 360px) {
 .ub-site .game-header { padding-inline: 13px; }
 .ub-site .site-header nav { gap: 10px; font-size: 11px; }
 .ub-site .game-header .brand .game-wordmark { width: 100px; }
 .ub-site .hero h1 { font-size: 50px; }
 .ub-site .hero-copy > p { font-size: 14px; }
 .ub-site .store-button { padding-inline: 12px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
 .ub-site .store-button:hover, .ub-site .store-button:active { transform: none; }
 .ub-site .demo-incoming.falling { transform: none; }
 .ub-site .land .impact { opacity: 1; }
}

/* Exact ConstructionGraphic blue-steel face, runtime atlas and gameplay aspect ratio. */
.ub-site .game-button { height: auto; aspect-ratio: 376 / 181; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.ub-site .game-button::before, .ub-site .game-button::after { display: none; }
.ub-site .button-frame, .ub-site .button-icon { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.ub-site .game-button:active { box-shadow: none; }

.ub-site .demo-options button:active { background: transparent; transform: translateY(1px); }