.frame:has(.gamification-screen) { aspect-ratio:auto; background:#0c241c }
.frame:has(.gamification-screen)::before { display:none }
.frame:has(.gamification-screen) #content { height:auto; display:block }
.frame:fullscreen:has(.gamification-screen), #expanded-view .frame:has(.gamification-screen) { overflow-y:auto }
.gamification-screen { position:relative }
.gamification-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); padding:0 }
.frame .gamification-screen img { display:block; width:100%; height:auto }
.gamification-start { display:block; position:absolute; left:4.55%; top:80.45%; width:32.1%; height:9.8%; border-radius:20px; border:0; padding:0; background:transparent; cursor:pointer }
.gamification-start span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
.gamification-start:hover { box-shadow:0 0 0 3px #f0c67a }
.gamification-mobile { display:none }
@container (max-width:800px) {
  .gamification-start { top:45.28cqw; height:5.51cqw }
  .gamification-mobile { display:flex; align-items:center; justify-content:center; min-height:48px; width:calc(100% - 32px); margin:16px; padding:12px; border:0; background:#f3d293; color:#0c241c; border-radius:12px; font:inherit; font-weight:700; text-align:center; cursor:pointer }
}
.gamification-bar { display:flex; align-items:center; gap:12px; padding:4px 62px 4px 12px; border-bottom:1px solid var(--line) }
.gamification-bar button { flex:none; min-height:44px; padding:6px 10px; font:inherit; font-size:14px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--forest); cursor:pointer }
.site-viewer .gamification-bar h1 { padding:0; border:0; font-size:14px }
@container (max-width:540px) {
  .site-viewer .gamification-bar h1 { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
}
.frame:has(.gamification-viewer)::before { display: none; }